amitwh/markdown-converter
1
0
Fork 0
mirror of https://github.com/amitwh/markdown-converter.git synced 2026-08-02 18:10:18 +05:30
Code Issues Packages Projects Releases Wiki Activity

style: run prettier formatter over src and tests

Browse Source
This commit is contained in:
amitwh
2026-06-11 20:46:00 +05:30
parent 2389d4f297
commit 6b564a4569
211 changed files with 6134 additions and 4234 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/adapters/electron/fs.js
+89 -89
View File
@@ -12,100 +12,100 @@
* @type {import('../types').FileSystemAdapter}
*/
const electronFsAdapter = {
/**
* Read file content
* @param {string} path - File path
* @returns {Promise<string>} File content
*/
async readFile(path) {
return await window.electronAPI.file.read(path);
},
/**
* Read file content
* @param {string} path - File path
* @returns {Promise<string>} File content
*/
async readFile(path) {
return await window.electronAPI.file.read(path);
},
/**
* Write content to file
* @param {string} path - File path
* @param {string} content - File content
* @returns {Promise<void>}
*/
async writeFile(path, content) {
return await window.electronAPI.file.write(path, content);
},
/**
* Write content to file
* @param {string} path - File path
* @param {string} content - File content
* @returns {Promise<void>}
*/
async writeFile(path, content) {
return await window.electronAPI.file.write(path, content);
},
/**
* Delete file
* @param {string} path - File path
* @returns {Promise<void>}
*/
async deleteFile(path) {
return await window.electronAPI.file.delete(path);
},
/**
* Delete file
* @param {string} path - File path
* @returns {Promise<void>}
*/
async deleteFile(path) {
return await window.electronAPI.file.delete(path);
},
/**
* Ensure directory exists
* @param {string} path - Directory path
* @returns {Promise<void>}
*/
async ensureDir(path) {
return await window.electronAPI.file.ensureDir(path);
},
/**
* Ensure directory exists
* @param {string} path - Directory path
* @returns {Promise<void>}
*/
async ensureDir(path) {
return await window.electronAPI.file.ensureDir(path);
},
/**
* List directory contents
* @param {string} path - Directory path
* @returns {Promise<Array<import('../types').FileInfo>>}
*/
async listDirectory(path) {
const result = await window.electronAPI.invoke('list-directory', path);
if (!result?.entries) {
return [];
}
return result.entries.map((entry) => ({
name: entry.name,
isDir: entry.isDirectory,
size: entry.size ?? 0,
modified: entry.modified ?? 0,
path: entry.path
}));
},
/**
* Check if path exists
* @param {string} path - Path to check
* @returns {Promise<boolean>}
*/
async exists(path) {
return await window.electronAPI.file.exists(path);
},
/**
* Check if path is a directory
* @param {string} path - Path to check
* @returns {Promise<boolean>}
*/
async isDirectory(path) {
return await window.electronAPI.file.isDirectory(path);
},
/**
* Copy file or directory
* @param {string} source - Source path
* @param {string} dest - Destination path
* @returns {Promise<void>}
*/
async copy(source, dest) {
return await window.electronAPI.file.copy(source, dest);
},
/**
* Move file or directory
* @param {string} source - Source path
* @param {string} dest - Destination path
* @returns {Promise<void>}
*/
async move(source, dest) {
return await window.electronAPI.file.move(source, dest);
/**
* List directory contents
* @param {string} path - Directory path
* @returns {Promise<Array<import('../types').FileInfo>>}
*/
async listDirectory(path) {
const result = await window.electronAPI.invoke('list-directory', path);
if (!result?.entries) {
return [];
}
return result.entries.map((entry) => ({
name: entry.name,
isDir: entry.isDirectory,
size: entry.size ?? 0,
modified: entry.modified ?? 0,
path: entry.path,
}));
},
/**
* Check if path exists
* @param {string} path - Path to check
* @returns {Promise<boolean>}
*/
async exists(path) {
return await window.electronAPI.file.exists(path);
},
/**
* Check if path is a directory
* @param {string} path - Path to check
* @returns {Promise<boolean>}
*/
async isDirectory(path) {
return await window.electronAPI.file.isDirectory(path);
},
/**
* Copy file or directory
* @param {string} source - Source path
* @param {string} dest - Destination path
* @returns {Promise<void>}
*/
async copy(source, dest) {
return await window.electronAPI.file.copy(source, dest);
},
/**
* Move file or directory
* @param {string} source - Source path
* @param {string} dest - Destination path
* @returns {Promise<void>}
*/
async move(source, dest) {
return await window.electronAPI.file.move(source, dest);
},
};
module.exports = { electronFsAdapter };
src/adapters/types.js
+1 -1
View File
@@ -129,5 +129,5 @@
*/
module.exports = {
// Type definitions are JSDoc only, no runtime exports needed
// Type definitions are JSDoc only, no runtime exports needed
};
src/analytics/analytics-panel.js
+41 -31
View File
@@ -5,19 +5,19 @@
const { analyze } = require('./writing-analytics');
function showAnalyticsModal(tabManager) {
const existing = document.getElementById('analytics-modal');
if (existing) existing.remove();
const existing = document.getElementById('analytics-modal');
if (existing) existing.remove();
const content = tabManager.getEditorContent();
const metrics = analyze(content);
const content = tabManager.getEditorContent();
const metrics = analyze(content);
const overlay = document.createElement('div');
overlay.id = 'analytics-modal';
overlay.className = 'analytics-overlay';
const overlay = document.createElement('div');
overlay.id = 'analytics-modal';
overlay.className = 'analytics-overlay';
const maxCount = metrics.topWords.length > 0 ? metrics.topWords[0].count : 1;
const maxCount = metrics.topWords.length > 0 ? metrics.topWords[0].count : 1;
overlay.innerHTML = `
overlay.innerHTML = `
<div class="analytics-modal">
<div class="analytics-header">
<h2>Writing Analytics</h2>
@@ -61,11 +61,15 @@ function showAnalyticsModal(tabManager) {
<span class="analytics-label">Avg Sentence</span>
<span class="analytics-value">${metrics.avgSentenceLength} words</span>
</div>
${metrics.longestSentenceLength > 0 ? `
${
metrics.longestSentenceLength > 0
? `
<div class="analytics-row analytics-longest">
<span class="analytics-label">Longest (${metrics.longestSentenceLength} words)</span>
<span class="analytics-value analytics-sentence-preview">${escapeHtml(metrics.longestSentence)}</span>
</div>` : ''}
</div>`
: ''
}
</div>
<div class="analytics-section">
@@ -74,39 +78,45 @@ function showAnalyticsModal(tabManager) {
<span class="analytics-label">Unique</span>
<span class="analytics-value">${metrics.uniqueWordCount} / ${metrics.wordCount}<small>${metrics.lexicalDiversity}%</small></span>
</div>
${metrics.topWords.length > 0 ? `
${
metrics.topWords.length > 0
? `
<div class="word-cloud">
${metrics.topWords.map(w => {
${metrics.topWords
.map((w) => {
const scale = 13 + Math.round((w.count / maxCount) * 3);
return `<span class="word-tag" style="font-size:${scale}px">${escapeHtml(w.word)}<small>${w.count}</small></span>`;
}).join('')}
</div>` : ''}
})
.join('')}
</div>`
: ''
}
</div>
</div>
</div>
`;
const closeBtn = overlay.querySelector('.analytics-close');
closeBtn.addEventListener('click', () => overlay.remove());
overlay.addEventListener('click', (e) => {
if (e.target === overlay) overlay.remove();
});
const closeBtn = overlay.querySelector('.analytics-close');
closeBtn.addEventListener('click', () => overlay.remove());
overlay.addEventListener('click', (e) => {
if (e.target === overlay) overlay.remove();
});
const escHandler = (e) => {
if (e.key === 'Escape') {
overlay.remove();
document.removeEventListener('keydown', escHandler);
}
};
document.addEventListener('keydown', escHandler);
const escHandler = (e) => {
if (e.key === 'Escape') {
overlay.remove();
document.removeEventListener('keydown', escHandler);
}
};
document.addEventListener('keydown', escHandler);
document.body.appendChild(overlay);
document.body.appendChild(overlay);
}
function escapeHtml(str) {
const div = document.createElement('div');
div.textContent = str;
return div.innerHTML;
const div = document.createElement('div');
div.textContent = str;
return div.innerHTML;
}
module.exports = { showAnalyticsModal };
src/analytics/writing-analytics.js
+177 -104
View File
@@ -4,124 +4,197 @@
*/
const STOP_WORDS = new Set([
'the', 'a', 'an', 'is', 'are', 'was', 'were', 'be', 'been',
'have', 'has', 'had', 'do', 'does', 'did', 'will', 'would',
'could', 'should', 'to', 'of', 'in', 'for', 'on', 'with',
'at', 'by', 'from', 'as', 'and', 'or', 'but', 'if', 'it',
'its', 'this', 'that', 'these', 'those', 'i', 'me', 'my',
'we', 'our', 'you', 'your', 'he', 'him', 'his', 'she', 'her',
'they', 'them', 'their', 'not', 'no', 'so', 'than', 'too',
'very', 'also', 'just', 'about', 'up', 'out', 'what', 'which', 'who'
'the',
'a',
'an',
'is',
'are',
'was',
'were',
'be',
'been',
'have',
'has',
'had',
'do',
'does',
'did',
'will',
'would',
'could',
'should',
'to',
'of',
'in',
'for',
'on',
'with',
'at',
'by',
'from',
'as',
'and',
'or',
'but',
'if',
'it',
'its',
'this',
'that',
'these',
'those',
'i',
'me',
'my',
'we',
'our',
'you',
'your',
'he',
'him',
'his',
'she',
'her',
'they',
'them',
'their',
'not',
'no',
'so',
'than',
'too',
'very',
'also',
'just',
'about',
'up',
'out',
'what',
'which',
'who',
]);
function countSyllables(word) {
word = word.toLowerCase().replace(/(?:[^laeiouy]es|ed|[^laeiouy]e)$/, '');
word = word.replace(/^y/, '');
return word.match(/[aeiouy]{1,2}/gi)?.length || 1;
word = word.toLowerCase().replace(/(?:[^laeiouy]es|ed|[^laeiouy]e)$/, '');
word = word.replace(/^y/, '');
return word.match(/[aeiouy]{1,2}/gi)?.length || 1;
}
function extractWords(text) {
return text.match(/[a-zA-Z]+(?:['-][a-zA-Z]+)*/g) || [];
return text.match(/[a-zA-Z]+(?:['-][a-zA-Z]+)*/g) || [];
}
function getReadabilityLabel(score) {
if (score >= 90) return 'Very Easy';
if (score >= 70) return 'Easy';
if (score >= 50) return 'Standard';
if (score >= 30) return 'Difficult';
return 'Very Difficult';
if (score >= 90) return 'Very Easy';
if (score >= 70) return 'Easy';
if (score >= 50) return 'Standard';
if (score >= 30) return 'Difficult';
return 'Very Difficult';
}
function analyze(text) {
if (!text || !text.trim()) {
return {
wordCount: 0,
sentenceCount: 0,
paragraphCount: 0,
fleschEase: 0,
fleschGrade: 0,
readabilityLabel: 'N/A',
readingTime: 0,
speakingTime: 0,
uniqueWordCount: 0,
lexicalDiversity: 0,
avgSentenceLength: 0,
longestSentence: '',
longestSentenceLength: 0,
topWords: []
};
}
const words = extractWords(text);
const wordCount = words.length;
const sentences = text.split(/[.!?]+/).map(s => s.trim()).filter(Boolean);
const sentenceCount = Math.max(sentences.length, 1);
const paragraphs = text.split(/\n\s*\n/).map(p => p.trim()).filter(Boolean);
const paragraphCount = Math.max(paragraphs.length, 1);
let totalSyllables = 0;
for (const w of words) {
totalSyllables += countSyllables(w);
}
const fleschEase = Math.round((206.835 - 1.015 * (wordCount / sentenceCount) - 84.6 * (totalSyllables / wordCount)) * 10) / 10;
const fleschGrade = Math.round((0.39 * (wordCount / sentenceCount) + 11.8 * (totalSyllables / wordCount) - 15.59) * 10) / 10;
const readabilityLabel = getReadabilityLabel(fleschEase);
const readingTime = Math.ceil(wordCount / 200);
const speakingTime = Math.ceil(wordCount / 130);
const uniqueWords = new Set(words.map(w => w.toLowerCase()));
const uniqueWordCount = uniqueWords.size;
const lexicalDiversity = wordCount > 0 ? Math.round((uniqueWordCount / wordCount) * 1000) / 10 : 0;
const avgSentenceLength = Math.round((wordCount / sentenceCount) * 10) / 10;
let longestSentence = '';
let longestSentenceLength = 0;
for (const s of sentences) {
const sWords = extractWords(s);
if (sWords.length > longestSentenceLength) {
longestSentenceLength = sWords.length;
longestSentence = s.trim();
}
}
if (longestSentence.length > 80) {
longestSentence = longestSentence.substring(0, 80) + '...';
}
const wordFreq = {};
for (const w of words) {
const lower = w.toLowerCase();
if (!STOP_WORDS.has(lower) && lower.length > 1) {
wordFreq[lower] = (wordFreq[lower] || 0) + 1;
}
}
const topWords = Object.entries(wordFreq)
.sort((a, b) => b[1] - a[1])
.slice(0, 10)
.map(([word, count]) => ({ word, count }));
if (!text || !text.trim()) {
return {
wordCount,
sentenceCount,
paragraphCount,
fleschEase,
fleschGrade,
readabilityLabel,
readingTime,
speakingTime,
uniqueWordCount,
lexicalDiversity,
avgSentenceLength,
longestSentence,
longestSentenceLength,
topWords
wordCount: 0,
sentenceCount: 0,
paragraphCount: 0,
fleschEase: 0,
fleschGrade: 0,
readabilityLabel: 'N/A',
readingTime: 0,
speakingTime: 0,
uniqueWordCount: 0,
lexicalDiversity: 0,
avgSentenceLength: 0,
longestSentence: '',
longestSentenceLength: 0,
topWords: [],
};
}
const words = extractWords(text);
const wordCount = words.length;
const sentences = text
.split(/[.!?]+/)
.map((s) => s.trim())
.filter(Boolean);
const sentenceCount = Math.max(sentences.length, 1);
const paragraphs = text
.split(/\n\s*\n/)
.map((p) => p.trim())
.filter(Boolean);
const paragraphCount = Math.max(paragraphs.length, 1);
let totalSyllables = 0;
for (const w of words) {
totalSyllables += countSyllables(w);
}
const fleschEase =
Math.round(
(206.835 - 1.015 * (wordCount / sentenceCount) - 84.6 * (totalSyllables / wordCount)) * 10
) / 10;
const fleschGrade =
Math.round(
(0.39 * (wordCount / sentenceCount) + 11.8 * (totalSyllables / wordCount) - 15.59) * 10
) / 10;
const readabilityLabel = getReadabilityLabel(fleschEase);
const readingTime = Math.ceil(wordCount / 200);
const speakingTime = Math.ceil(wordCount / 130);
const uniqueWords = new Set(words.map((w) => w.toLowerCase()));
const uniqueWordCount = uniqueWords.size;
const lexicalDiversity =
wordCount > 0 ? Math.round((uniqueWordCount / wordCount) * 1000) / 10 : 0;
const avgSentenceLength = Math.round((wordCount / sentenceCount) * 10) / 10;
let longestSentence = '';
let longestSentenceLength = 0;
for (const s of sentences) {
const sWords = extractWords(s);
if (sWords.length > longestSentenceLength) {
longestSentenceLength = sWords.length;
longestSentence = s.trim();
}
}
if (longestSentence.length > 80) {
longestSentence = longestSentence.substring(0, 80) + '...';
}
const wordFreq = {};
for (const w of words) {
const lower = w.toLowerCase();
if (!STOP_WORDS.has(lower) && lower.length > 1) {
wordFreq[lower] = (wordFreq[lower] || 0) + 1;
}
}
const topWords = Object.entries(wordFreq)
.sort((a, b) => b[1] - a[1])
.slice(0, 10)
.map(([word, count]) => ({ word, count }));
return {
wordCount,
sentenceCount,
paragraphCount,
fleschEase,
fleschGrade,
readabilityLabel,
readingTime,
speakingTime,
uniqueWordCount,
lexicalDiversity,
avgSentenceLength,
longestSentence,
longestSentenceLength,
topWords,
};
}
module.exports = { analyze };
src/editor/codemirror-setup.js
+36 -29
View File
@@ -12,38 +12,23 @@ 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 { 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');
// Custom theme for JetBrains Mono font
const jetBrainsMonoTheme = EditorView.theme({
'&': {
fontFamily: "'JetBrains Mono', 'Fira Code', 'SF Mono', Monaco, 'Courier New', monospace"
fontFamily: "'JetBrains Mono', 'Fira Code', 'SF Mono', Monaco, 'Courier New', monospace",
},
'.cm-content': {
fontFamily: 'inherit'
fontFamily: 'inherit',
},
'.cm-scroller': {
fontFamily: 'inherit'
}
fontFamily: 'inherit',
},
});
/**
@@ -59,7 +44,14 @@ const jetBrainsMonoTheme = EditorView.theme({
* @returns {EditorView} the created editor view
*/
function createEditor(parentElement, options = {}) {
console.log('[createEditor] Called with parentElement:', parentElement?.id, 'dimensions:', parentElement?.clientWidth, 'x', parentElement?.clientHeight);
console.log(
'[createEditor] Called with parentElement:',
parentElement?.id,
'dimensions:',
parentElement?.clientWidth,
'x',
parentElement?.clientHeight
);
if (!parentElement) {
console.error('[createEditor] ERROR: parentElement is null or undefined!');
return null;
@@ -125,11 +117,26 @@ function createEditor(parentElement, options = {}) {
*/
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(); },
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;
src/main/PDFOperations.js
+62 -43
View File
@@ -4,11 +4,11 @@ const { PDFDocument, rgb, degrees, StandardFonts } = require('pdf-lib');
function parsePageRanges(rangeString, totalPages) {
const pages = [];
const ranges = rangeString.split(',').map(r => r.trim());
const ranges = rangeString.split(',').map((r) => r.trim());
for (const range of ranges) {
if (range.includes('-')) {
const [start, end] = range.split('-').map(n => parseInt(n.trim()));
const [start, end] = range.split('-').map((n) => parseInt(n.trim()));
for (let i = start; i <= end && i <= totalPages; i++) {
if (i > 0 && !pages.includes(i - 1)) {
pages.push(i - 1);
@@ -27,11 +27,13 @@ function parsePageRanges(rangeString, totalPages) {
function hexToRgb(hex) {
const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
return result ? {
r: parseInt(result[1], 16) / 255,
g: parseInt(result[2], 16) / 255,
b: parseInt(result[3], 16) / 255
} : { r: 0, g: 0, b: 0 };
return result
? {
r: parseInt(result[1], 16) / 255,
g: parseInt(result[2], 16) / 255,
b: parseInt(result[3], 16) / 255,
}
: { r: 0, g: 0, b: 0 };
}
async function pdfMerge(data) {
@@ -42,7 +44,7 @@ async function pdfMerge(data) {
const pdfBytes = fs.readFileSync(filePath);
const pdf = await PDFDocument.load(pdfBytes);
const copiedPages = await mergedPdf.copyPages(pdf, pdf.getPageIndices());
copiedPages.forEach(page => mergedPdf.addPage(page));
copiedPages.forEach((page) => mergedPdf.addPage(page));
}
const pdfBytes = await mergedPdf.save();
@@ -63,13 +65,13 @@ async function pdfSplit(data) {
const splits = [];
if (data.splitMode === 'pages') {
const ranges = data.pageRanges.split(',').map(r => r.trim());
const ranges = data.pageRanges.split(',').map((r) => r.trim());
for (let i = 0; i < ranges.length; i++) {
const range = ranges[i];
const pages = [];
if (range.includes('-')) {
const [start, end] = range.split('-').map(n => parseInt(n.trim()));
const [start, end] = range.split('-').map((n) => parseInt(n.trim()));
for (let p = start; p <= end && p <= totalPages; p++) {
pages.push(p - 1);
}
@@ -108,7 +110,7 @@ async function pdfSplit(data) {
for (const split of splits) {
const newPdf = await PDFDocument.create();
const copiedPages = await newPdf.copyPages(pdf, split.pages);
copiedPages.forEach(page => newPdf.addPage(page));
copiedPages.forEach((page) => newPdf.addPage(page));
const outputPath = path.join(data.outputFolder, `${baseName}_${split.name}.pdf`);
const newPdfBytes = await newPdf.save();
@@ -129,18 +131,18 @@ async function pdfCompress(data) {
const compressedPdfBytes = await pdf.save({
useObjectStreams: true,
addDefaultPage: false,
objectsPerTick: 50
objectsPerTick: 50,
});
fs.writeFileSync(data.outputPath, compressedPdfBytes);
const originalSize = fs.statSync(data.inputPath).size;
const compressedSize = fs.statSync(data.outputPath).size;
const savings = ((originalSize - compressedSize) / originalSize * 100).toFixed(1);
const savings = (((originalSize - compressedSize) / originalSize) * 100).toFixed(1);
return {
success: true,
message: `PDF compressed. Size reduced by ${savings}% (${(originalSize / 1024).toFixed(1)}KB → ${(compressedSize / 1024).toFixed(1)}KB)`
message: `PDF compressed. Size reduced by ${savings}% (${(originalSize / 1024).toFixed(1)}KB → ${(compressedSize / 1024).toFixed(1)}KB)`,
};
} catch (error) {
return { success: false, error: error.message };
@@ -160,7 +162,7 @@ async function pdfRotate(data) {
pagesToRotate = Array.from({ length: totalPages }, (_, i) => i);
}
pagesToRotate.forEach(pageIndex => {
pagesToRotate.forEach((pageIndex) => {
const page = pdf.getPage(pageIndex);
page.setRotation(degrees(data.angle));
});
@@ -170,7 +172,7 @@ async function pdfRotate(data) {
return {
success: true,
message: `Successfully rotated ${pagesToRotate.length} page(s) by ${data.angle}\u00B0`
message: `Successfully rotated ${pagesToRotate.length} page(s) by ${data.angle}\u00B0`,
};
} catch (error) {
return { success: false, error: error.message };
@@ -185,16 +187,18 @@ async function pdfDeletePages(data) {
const pagesToDelete = parsePageRanges(data.pages, totalPages);
pagesToDelete.sort((a, b) => b - a).forEach(pageIndex => {
pdf.removePage(pageIndex);
});
pagesToDelete
.sort((a, b) => b - a)
.forEach((pageIndex) => {
pdf.removePage(pageIndex);
});
const newPdfBytes = await pdf.save();
fs.writeFileSync(data.outputPath, newPdfBytes);
return {
success: true,
message: `Successfully deleted ${pagesToDelete.length} page(s). New PDF has ${totalPages - pagesToDelete.length} pages`
message: `Successfully deleted ${pagesToDelete.length} page(s). New PDF has ${totalPages - pagesToDelete.length} pages`,
};
} catch (error) {
return { success: false, error: error.message };
@@ -207,7 +211,7 @@ async function pdfReorder(data) {
const pdf = await PDFDocument.load(pdfBytes);
const totalPages = pdf.getPageCount();
const newOrder = data.newOrder.split(',').map(n => parseInt(n.trim()) - 1);
const newOrder = data.newOrder.split(',').map((n) => parseInt(n.trim()) - 1);
if (newOrder.length !== totalPages) {
return { success: false, error: `New order must include all ${totalPages} pages` };
@@ -215,7 +219,7 @@ async function pdfReorder(data) {
const newPdf = await PDFDocument.create();
const copiedPages = await newPdf.copyPages(pdf, newOrder);
copiedPages.forEach(page => newPdf.addPage(page));
copiedPages.forEach((page) => newPdf.addPage(page));
const reorderedPdfBytes = await newPdf.save();
fs.writeFileSync(data.outputPath, reorderedPdfBytes);
@@ -246,7 +250,9 @@ async function pdfWatermark(data) {
const page = pdf.getPage(pageIndex);
const { width, height } = page.getSize();
let x, y, rotation = 0;
let x,
y,
rotation = 0;
switch (data.position) {
case 'center':
@@ -294,7 +300,7 @@ async function pdfWatermark(data) {
font,
color: rgb(color.r, color.g, color.b),
opacity: data.opacity,
rotate: degrees(rotation)
rotate: degrees(rotation),
});
}
@@ -303,7 +309,7 @@ async function pdfWatermark(data) {
return {
success: true,
message: `Successfully added watermark to ${pagesToWatermark.length} page(s)`
message: `Successfully added watermark to ${pagesToWatermark.length} page(s)`,
};
} catch (error) {
return { success: false, error: error.message };
@@ -325,8 +331,8 @@ async function pdfEncrypt(data) {
annotating: data.permissions.annotating,
fillingForms: data.permissions.fillingForms,
contentAccessibility: data.permissions.contentAccessibility,
documentAssembly: data.permissions.documentAssembly
}
documentAssembly: data.permissions.documentAssembly,
},
});
fs.writeFileSync(data.outputPath, encryptedPdfBytes);
@@ -336,7 +342,8 @@ async function pdfEncrypt(data) {
if (error.message.includes('encrypt') || error.message.includes('password')) {
return {
success: false,
error: 'PDF encryption requires pdf-lib with encryption support. This feature may not be available in the current version.'
error:
'PDF encryption requires pdf-lib with encryption support. This feature may not be available in the current version.',
};
}
return { success: false, error: error.message };
@@ -375,8 +382,8 @@ async function pdfSetPermissions(data) {
annotating: data.permissions.annotating,
fillingForms: data.permissions.fillingForms,
contentAccessibility: data.permissions.contentAccessibility,
documentAssembly: data.permissions.documentAssembly
}
documentAssembly: data.permissions.documentAssembly,
},
});
fs.writeFileSync(data.outputPath, newPdfBytes);
@@ -386,7 +393,8 @@ async function pdfSetPermissions(data) {
if (error.message.includes('encrypt') || error.message.includes('permission')) {
return {
success: false,
error: 'PDF permissions require pdf-lib with encryption support. This feature may not be available in the current version.'
error:
'PDF permissions require pdf-lib with encryption support. This feature may not be available in the current version.',
};
}
return { success: false, error: error.message };
@@ -395,17 +403,28 @@ async function pdfSetPermissions(data) {
function executeOperation(operation, data) {
switch (operation) {
case 'merge': return pdfMerge(data);
case 'split': return pdfSplit(data);
case 'compress': return pdfCompress(data);
case 'rotate': return pdfRotate(data);
case 'delete': return pdfDeletePages(data);
case 'reorder': return pdfReorder(data);
case 'watermark': return pdfWatermark(data);
case 'encrypt': return pdfEncrypt(data);
case 'decrypt': return pdfDecrypt(data);
case 'permissions': return pdfSetPermissions(data);
default: return Promise.resolve({ success: false, error: `Unknown operation: ${operation}` });
case 'merge':
return pdfMerge(data);
case 'split':
return pdfSplit(data);
case 'compress':
return pdfCompress(data);
case 'rotate':
return pdfRotate(data);
case 'delete':
return pdfDeletePages(data);
case 'reorder':
return pdfReorder(data);
case 'watermark':
return pdfWatermark(data);
case 'encrypt':
return pdfEncrypt(data);
case 'decrypt':
return pdfDecrypt(data);
case 'permissions':
return pdfSetPermissions(data);
default:
return Promise.resolve({ success: false, error: `Unknown operation: ${operation}` });
}
}
@@ -429,5 +448,5 @@ module.exports = {
pdfDecrypt,
pdfSetPermissions,
executeOperation,
getPageCount
getPageCount,
};
src/main/files/git.js
+12 -4
View File
@@ -5,22 +5,30 @@ const GitOperations = require('../GitOperations');
function register(currentFileRef) {
ipcMain.handle('git-status', async () => {
const dir = currentFileRef.current ? require('path').dirname(currentFileRef.current) : process.cwd();
const dir = currentFileRef.current
? require('path').dirname(currentFileRef.current)
: process.cwd();
return GitOperations.getStatus(dir);
});
ipcMain.handle('git-stage', async (_event, { files }) => {
const dir = currentFileRef.current ? require('path').dirname(currentFileRef.current) : process.cwd();
const dir = currentFileRef.current
? require('path').dirname(currentFileRef.current)
: process.cwd();
return GitOperations.stage(dir, files);
});
ipcMain.handle('git-commit', async (_event, { message }) => {
const dir = currentFileRef.current ? require('path').dirname(currentFileRef.current) : process.cwd();
const dir = currentFileRef.current
? require('path').dirname(currentFileRef.current)
: process.cwd();
return GitOperations.commit(dir, message);
});
ipcMain.handle('git-log', async () => {
const dir = currentFileRef.current ? require('path').dirname(currentFileRef.current) : process.cwd();
const dir = currentFileRef.current
? require('path').dirname(currentFileRef.current)
: process.cwd();
return GitOperations.log(dir);
});
}
src/main/files/index.js
+7 -1
View File
@@ -6,7 +6,13 @@ const path = require('path');
const { register: registerGit } = require('./git');
const { register: registerBinary } = require('./binary');
function register({ validatePath, resolveWritablePath, isPathAccessible, currentFileRef, mainWindow }) {
function register({
validatePath,
resolveWritablePath,
isPathAccessible,
currentFileRef,
mainWindow,
}) {
// pick-folder
ipcMain.handle('pick-folder', async () => {
const result = await dialog.showOpenDialog(mainWindow, {
src/main/index.js
+690 -513
View File
File diff suppressed because it is too large Load Diff
src/main/ipc/crash-handlers.js
+4 -1
View File
@@ -10,7 +10,10 @@ function register({ crash, getMainWindow }) {
});
ipcMain.handle('crash:delete', (_event, filename) => {
if (typeof filename === 'string' && /^\d+(-\d+)?-(uncaughtException|unhandledRejection)\.json$/.test(filename)) {
if (
typeof filename === 'string' &&
/^\d+(-\d+)?-(uncaughtException|unhandledRejection)\.json$/.test(filename)
) {
crash.delete(filename);
return true;
}
src/main/menu/index.js
+2 -2
View File
@@ -10,7 +10,7 @@ const {
convertItems,
pdfEditorItems,
toolsItems,
helpItems
helpItems,
} = require('./items');
function buildMenu(mainWindow) {
@@ -22,7 +22,7 @@ function buildMenu(mainWindow) {
{ label: '&Convert', submenu: convertItems(mainWindow) },
{ label: 'PDF Editor', submenu: pdfEditorItems(mainWindow) },
{ label: '&Tools', submenu: toolsItems(mainWindow) },
{ label: '&Help', submenu: helpItems(mainWindow) }
{ label: '&Help', submenu: helpItems(mainWindow) },
];
return Menu.buildFromTemplate(template);
}
src/main/menu/items.js
+403 -132
View File
@@ -11,14 +11,14 @@ function buildRecentFilesMenu(mainWindow) {
const recentFilesPath = path.join(app.getPath('userData'), 'recent-files.json');
if (!fs.existsSync(recentFilesPath)) return [{ label: 'No Recent Files', enabled: false }];
const recentFiles = JSON.parse(fs.readFileSync(recentFilesPath, 'utf-8'));
const existing = recentFiles.filter(file => fs.existsSync(file));
const existing = recentFiles.filter((file) => fs.existsSync(file));
if (existing.length === 0) return [{ label: 'No Recent Files', enabled: false }];
const items = existing.map(file => ({
const items = existing.map((file) => ({
label: path.basename(file),
click: () => {
const { openFileFromPath } = require('../index');
openFileFromPath(file);
}
},
}));
items.push(
{ type: 'separator' },
@@ -28,7 +28,7 @@ function buildRecentFilesMenu(mainWindow) {
if (mainWindow) {
mainWindow.webContents.send('clear-recent-files');
}
}
},
}
);
return items;
@@ -42,7 +42,7 @@ function fileItems(mainWindow) {
{
label: 'New',
accelerator: 'CmdOrCtrl+N',
click: () => mainWindow.webContents.send('file-new')
click: () => mainWindow.webContents.send('file-new'),
},
{
label: 'Open',
@@ -50,7 +50,7 @@ function fileItems(mainWindow) {
click: () => {
const { openFile } = require('../index');
openFile();
}
},
},
{
label: 'Open PDF',
@@ -58,12 +58,12 @@ function fileItems(mainWindow) {
click: () => {
const { openPdfFile } = require('../index');
openPdfFile();
}
},
},
{
label: 'Save',
accelerator: 'CmdOrCtrl+S',
click: () => mainWindow.webContents.send('file-save')
click: () => mainWindow.webContents.send('file-save'),
},
{
label: 'Save As',
@@ -71,30 +71,60 @@ function fileItems(mainWindow) {
click: () => {
const { saveAsFile } = require('../index');
saveAsFile();
}
},
},
{ type: 'separator' },
// NOTE: Print Preview submenu removed — handled by React <PrintPreview> overlay
{ type: 'separator' },
{
label: 'Recent Files',
submenu: buildRecentFilesMenu(mainWindow)
submenu: buildRecentFilesMenu(mainWindow),
},
{ 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') }
]
{
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' },
{
@@ -103,58 +133,137 @@ function fileItems(mainWindow) {
click: () => {
const { importDocument } = require('../index');
importDocument();
}
},
},
{
label: 'Export',
submenu: [
{
label: 'HTML', click: () => {
label: 'HTML',
click: () => {
const { exportFile } = require('../index');
exportFile('html');
}
},
},
{
label: 'PDF', click: () => {
label: 'PDF',
click: () => {
const { exportFile } = require('../index');
exportFile('pdf');
}
},
},
{
label: 'PDF (Enhanced)', click: () => {
label: 'PDF (Enhanced)',
click: () => {
const { exportPDFViaWordTemplate } = require('../index');
exportPDFViaWordTemplate();
}, accelerator: 'Ctrl+Shift+P'
},
accelerator: 'Ctrl+Shift+P',
},
{
label: 'DOCX', click: () => {
label: 'DOCX',
click: () => {
const { exportFile } = require('../index');
exportFile('docx');
}
},
},
{
label: 'DOCX (Enhanced)', click: () => {
label: 'DOCX (Enhanced)',
click: () => {
const { exportWordWithTemplate } = require('../index');
exportWordWithTemplate();
}, accelerator: 'Ctrl+Shift+W'
},
accelerator: 'Ctrl+Shift+W',
},
{
label: 'LaTeX',
click: () => {
const { exportFile } = require('../index');
exportFile('latex');
},
},
{
label: 'RTF',
click: () => {
const { exportFile } = require('../index');
exportFile('rtf');
},
},
{
label: 'ODT',
click: () => {
const { exportFile } = require('../index');
exportFile('odt');
},
},
{
label: 'EPUB',
click: () => {
const { exportFile } = require('../index');
exportFile('epub');
},
},
{ label: 'LaTeX', click: () => { const { exportFile } = require('../index'); exportFile('latex'); } },
{ label: 'RTF', click: () => { const { exportFile } = require('../index'); exportFile('rtf'); } },
{ label: 'ODT', click: () => { const { exportFile } = require('../index'); exportFile('odt'); } },
{ label: 'EPUB', click: () => { const { exportFile } = require('../index'); exportFile('epub'); } },
{ type: 'separator' },
{ label: 'PowerPoint (PPTX)', click: () => { const { exportFile } = require('../index'); exportFile('pptx'); } },
{ label: 'OpenDocument Presentation (ODP)', click: () => { const { exportFile } = require('../index'); exportFile('odp'); } },
{
label: 'PowerPoint (PPTX)',
click: () => {
const { exportFile } = require('../index');
exportFile('pptx');
},
},
{
label: 'OpenDocument Presentation (ODP)',
click: () => {
const { exportFile } = require('../index');
exportFile('odp');
},
},
{ type: 'separator' },
{ label: 'CSV (Tables)', click: () => { const { exportSpreadsheet } = require('../index'); exportSpreadsheet('csv'); } },
{
label: 'CSV (Tables)',
click: () => {
const { exportSpreadsheet } = require('../index');
exportSpreadsheet('csv');
},
},
{ type: 'separator' },
{ label: 'JSON (.json)', click: () => { const { exportFile } = require('../index'); exportFile('json'); } },
{ label: 'YAML (.yaml)', click: () => { const { exportFile } = require('../index'); exportFile('yaml'); } },
{ label: 'XML (.xml)', click: () => { const { exportFile } = require('../index'); exportFile('xml'); } },
{
label: 'JSON (.json)',
click: () => {
const { exportFile } = require('../index');
exportFile('json');
},
},
{
label: 'YAML (.yaml)',
click: () => {
const { exportFile } = require('../index');
exportFile('yaml');
},
},
{
label: 'XML (.xml)',
click: () => {
const { exportFile } = require('../index');
exportFile('xml');
},
},
{ type: 'separator' },
{ label: 'Confluence Wiki (.txt)', click: () => { const { exportFile } = require('../index'); exportFile('confluence'); } },
{ label: 'MOBI E-book (.mobi)', click: () => { const { exportFile } = require('../index'); exportFile('mobi'); } }
]
{
label: 'Confluence Wiki (.txt)',
click: () => {
const { exportFile } = require('../index');
exportFile('confluence');
},
},
{
label: 'MOBI E-book (.mobi)',
click: () => {
const { exportFile } = require('../index');
exportFile('mobi');
},
},
],
},
{ type: 'separator' },
{
@@ -162,14 +271,14 @@ function fileItems(mainWindow) {
click: () => {
const { selectWordTemplate } = require('../index');
selectWordTemplate();
}
},
},
{
label: 'Template Settings...',
click: () => {
const { showTemplateSettings } = require('../index');
showTemplateSettings();
}
},
},
{
label: 'Header & Footer Settings...',
@@ -177,14 +286,14 @@ function fileItems(mainWindow) {
if (mainWindow) {
mainWindow.webContents.send('open-header-footer-dialog');
}
}
},
},
{ type: 'separator' },
{
label: 'Quit',
accelerator: process.platform === 'darwin' ? 'Cmd+Q' : 'Ctrl+Q',
click: () => app.quit()
}
click: () => app.quit(),
},
];
}
@@ -193,12 +302,12 @@ function editItems(mainWindow) {
{
label: 'Undo',
accelerator: 'CmdOrCtrl+Z',
click: () => mainWindow.webContents.send('undo')
click: () => mainWindow.webContents.send('undo'),
},
{
label: 'Redo',
accelerator: 'CmdOrCtrl+Shift+Z',
click: () => mainWindow.webContents.send('redo')
click: () => mainWindow.webContents.send('redo'),
},
{ type: 'separator' },
{ label: 'Cut', accelerator: 'CmdOrCtrl+X', role: 'cut' },
@@ -209,8 +318,8 @@ function editItems(mainWindow) {
{
label: 'Find & Replace',
accelerator: 'CmdOrCtrl+F',
click: () => mainWindow.webContents.send('toggle-find')
}
click: () => mainWindow.webContents.send('toggle-find'),
},
];
}
@@ -219,60 +328,222 @@ function viewItems(mainWindow) {
{
label: 'Toggle Preview',
accelerator: 'CmdOrCtrl+Shift+V',
click: () => mainWindow.webContents.send('toggle-preview')
click: () => mainWindow.webContents.send('toggle-preview'),
},
{
label: 'Writing Analytics',
accelerator: 'CmdOrCtrl+Shift+A',
click: () => mainWindow.webContents.send('show-analytics-dialog')
click: () => mainWindow.webContents.send('show-analytics-dialog'),
},
// NOTE: Command Palette removed — handled by useCommandStore
{ type: 'separator' },
{
label: 'Sidebar',
submenu: [
{ label: 'Files', click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'explorer') },
{ label: 'Outline', click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'outline') },
{ label: 'Snippets', click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'snippets') },
{ label: 'Templates', click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'templates') },
{ label: 'Git', click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'git') }
]
{
label: 'Files',
click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'explorer'),
},
{
label: 'Outline',
click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'outline'),
},
{
label: 'Snippets',
click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'snippets'),
},
{
label: 'Templates',
click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'templates'),
},
{ label: 'Git', click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'git') },
],
},
{
label: 'Bottom Panel (REPL)',
click: () => mainWindow.webContents.send('toggle-bottom-panel')
click: () => mainWindow.webContents.send('toggle-bottom-panel'),
},
{ type: 'separator' },
{
label: 'Theme',
submenu: [
{ label: 'Atom One Light (Default)', click: () => { const { setTheme } = require('../index'); setTheme('atomonelight'); } },
{ label: 'GitHub Light', click: () => { const { setTheme } = require('../index'); setTheme('github'); } },
{ label: 'Light', click: () => { const { setTheme } = require('../index'); setTheme('light'); } },
{ label: 'Solarized Light', click: () => { const { setTheme } = require('../index'); setTheme('solarized'); } },
{ label: 'Gruvbox Light', click: () => { const { setTheme } = require('../index'); setTheme('gruvbox-light'); } },
{ label: 'Ayu Light', click: () => { const { setTheme } = require('../index'); setTheme('ayu-light'); } },
{ label: 'Sepia', click: () => { const { setTheme } = require('../index'); setTheme('sepia'); } },
{ label: 'Paper', click: () => { const { setTheme } = require('../index'); setTheme('paper'); } },
{ label: 'Rose Pine Dawn', click: () => { const { setTheme } = require('../index'); setTheme('rosepine-dawn'); } },
{ label: 'Concrete Light', click: () => { const { setTheme } = require('../index'); setTheme('concrete-light'); } },
{
label: 'Atom One Light (Default)',
click: () => {
const { setTheme } = require('../index');
setTheme('atomonelight');
},
},
{
label: 'GitHub Light',
click: () => {
const { setTheme } = require('../index');
setTheme('github');
},
},
{
label: 'Light',
click: () => {
const { setTheme } = require('../index');
setTheme('light');
},
},
{
label: 'Solarized Light',
click: () => {
const { setTheme } = require('../index');
setTheme('solarized');
},
},
{
label: 'Gruvbox Light',
click: () => {
const { setTheme } = require('../index');
setTheme('gruvbox-light');
},
},
{
label: 'Ayu Light',
click: () => {
const { setTheme } = require('../index');
setTheme('ayu-light');
},
},
{
label: 'Sepia',
click: () => {
const { setTheme } = require('../index');
setTheme('sepia');
},
},
{
label: 'Paper',
click: () => {
const { setTheme } = require('../index');
setTheme('paper');
},
},
{
label: 'Rose Pine Dawn',
click: () => {
const { setTheme } = require('../index');
setTheme('rosepine-dawn');
},
},
{
label: 'Concrete Light',
click: () => {
const { setTheme } = require('../index');
setTheme('concrete-light');
},
},
{ type: 'separator' },
{ label: 'Dark', click: () => { const { setTheme } = require('../index'); setTheme('dark'); } },
{ label: 'One Dark', click: () => { const { setTheme } = require('../index'); setTheme('onedark'); } },
{ label: 'Dracula', click: () => { const { setTheme } = require('../index'); setTheme('dracula'); } },
{ label: 'Nord', click: () => { const { setTheme } = require('../index'); setTheme('nord'); } },
{ label: 'Monokai', click: () => { const { setTheme } = require('../index'); setTheme('monokai'); } },
{ label: 'Material', click: () => { const { setTheme } = require('../index'); setTheme('material'); } },
{ label: 'Gruvbox Dark', click: () => { const { setTheme } = require('../index'); setTheme('gruvbox-dark'); } },
{ label: 'Tokyo Night', click: () => { const { setTheme } = require('../index'); setTheme('tokyonight'); } },
{ label: 'Palenight', click: () => { const { setTheme } = require('../index'); setTheme('palenight'); } },
{ label: 'Ayu Dark', click: () => { const { setTheme } = require('../index'); setTheme('ayu-dark'); } },
{ label: 'Ayu Mirage', click: () => { const { setTheme } = require('../index'); setTheme('ayu-mirage'); } },
{ label: 'Oceanic Next', click: () => { const { setTheme } = require('../index'); setTheme('oceanic-next'); } },
{ label: 'Cobalt2', click: () => { const { setTheme } = require('../index'); setTheme('cobalt2'); } },
{ label: 'Concrete Dark', click: () => { const { setTheme } = require('../index'); setTheme('concrete-dark'); } },
{ label: 'Concrete Warm', click: () => { const { setTheme } = require('../index'); setTheme('concrete-warm'); } }
]
{
label: 'Dark',
click: () => {
const { setTheme } = require('../index');
setTheme('dark');
},
},
{
label: 'One Dark',
click: () => {
const { setTheme } = require('../index');
setTheme('onedark');
},
},
{
label: 'Dracula',
click: () => {
const { setTheme } = require('../index');
setTheme('dracula');
},
},
{
label: 'Nord',
click: () => {
const { setTheme } = require('../index');
setTheme('nord');
},
},
{
label: 'Monokai',
click: () => {
const { setTheme } = require('../index');
setTheme('monokai');
},
},
{
label: 'Material',
click: () => {
const { setTheme } = require('../index');
setTheme('material');
},
},
{
label: 'Gruvbox Dark',
click: () => {
const { setTheme } = require('../index');
setTheme('gruvbox-dark');
},
},
{
label: 'Tokyo Night',
click: () => {
const { setTheme } = require('../index');
setTheme('tokyonight');
},
},
{
label: 'Palenight',
click: () => {
const { setTheme } = require('../index');
setTheme('palenight');
},
},
{
label: 'Ayu Dark',
click: () => {
const { setTheme } = require('../index');
setTheme('ayu-dark');
},
},
{
label: 'Ayu Mirage',
click: () => {
const { setTheme } = require('../index');
setTheme('ayu-mirage');
},
},
{
label: 'Oceanic Next',
click: () => {
const { setTheme } = require('../index');
setTheme('oceanic-next');
},
},
{
label: 'Cobalt2',
click: () => {
const { setTheme } = require('../index');
setTheme('cobalt2');
},
},
{
label: 'Concrete Dark',
click: () => {
const { setTheme } = require('../index');
setTheme('concrete-dark');
},
},
{
label: 'Concrete Warm',
click: () => {
const { setTheme } = require('../index');
setTheme('concrete-warm');
},
},
],
},
{ type: 'separator' },
{
@@ -281,19 +552,19 @@ function viewItems(mainWindow) {
{
label: 'Increase Font Size',
accelerator: 'CmdOrCtrl+Shift+Plus',
click: () => mainWindow.webContents.send('adjust-font-size', 'increase')
click: () => mainWindow.webContents.send('adjust-font-size', 'increase'),
},
{
label: 'Decrease Font Size',
accelerator: 'CmdOrCtrl+Shift+-',
click: () => mainWindow.webContents.send('adjust-font-size', 'decrease')
click: () => mainWindow.webContents.send('adjust-font-size', 'decrease'),
},
{
label: 'Reset Font Size',
accelerator: 'CmdOrCtrl+Shift+0',
click: () => mainWindow.webContents.send('adjust-font-size', 'reset')
}
]
click: () => mainWindow.webContents.send('adjust-font-size', 'reset'),
},
],
},
{ type: 'separator' },
{
@@ -302,7 +573,7 @@ function viewItems(mainWindow) {
checked: true,
click: (menuItem) => {
mainWindow.webContents.session.setSpellCheckerEnabled(menuItem.checked);
}
},
},
{ type: 'separator' },
{
@@ -310,13 +581,13 @@ function viewItems(mainWindow) {
submenu: [
{
label: 'Load Custom Preview CSS...',
click: () => mainWindow.webContents.send('load-custom-css')
click: () => mainWindow.webContents.send('load-custom-css'),
},
{
label: 'Clear Custom Preview CSS',
click: () => mainWindow.webContents.send('clear-custom-css')
}
]
click: () => mainWindow.webContents.send('clear-custom-css'),
},
],
},
{ type: 'separator' },
{ label: 'Reload', accelerator: 'CmdOrCtrl+R', role: 'reload' },
@@ -324,7 +595,7 @@ function viewItems(mainWindow) {
{ type: 'separator' },
{ label: 'Zoom In', accelerator: 'CmdOrCtrl+Plus', role: 'zoomIn' },
{ label: 'Zoom Out', accelerator: 'CmdOrCtrl+-', role: 'zoomOut' },
{ label: 'Reset Zoom', accelerator: 'CmdOrCtrl+0', role: 'resetZoom' }
{ label: 'Reset Zoom', accelerator: 'CmdOrCtrl+0', role: 'resetZoom' },
];
}
@@ -335,25 +606,25 @@ function batchItems(mainWindow) {
click: () => {
const { showBatchConversionDialog } = require('../index');
showBatchConversionDialog();
}
},
},
{ type: 'separator' },
{
label: 'Batch Image Conversion...',
click: () => mainWindow.webContents.send('show-batch-converter', 'image')
click: () => mainWindow.webContents.send('show-batch-converter', 'image'),
},
{
label: 'Batch Audio Conversion...',
click: () => mainWindow.webContents.send('show-batch-converter', 'audio')
click: () => mainWindow.webContents.send('show-batch-converter', 'audio'),
},
{
label: 'Batch Video Conversion...',
click: () => mainWindow.webContents.send('show-batch-converter', 'video')
click: () => mainWindow.webContents.send('show-batch-converter', 'video'),
},
{
label: 'Batch PDF Conversion...',
click: () => mainWindow.webContents.send('show-batch-converter', 'pdf')
}
click: () => mainWindow.webContents.send('show-batch-converter', 'pdf'),
},
];
}
@@ -365,8 +636,8 @@ function convertItems(mainWindow) {
click: () => {
const { showUniversalConverterDialog } = require('../index');
showUniversalConverterDialog();
}
}
},
},
];
}
@@ -378,7 +649,7 @@ function pdfEditorItems(mainWindow) {
click: () => {
const { openPdfFile } = require('../index');
openPdfFile();
}
},
},
{ type: 'separator' },
{
@@ -386,21 +657,21 @@ function pdfEditorItems(mainWindow) {
click: () => {
const { showPDFEditorDialog } = require('../index');
showPDFEditorDialog('merge');
}
},
},
{
label: 'Split PDF...',
click: () => {
const { showPDFEditorDialog } = require('../index');
showPDFEditorDialog('split');
}
},
},
{
label: 'Compress PDF...',
click: () => {
const { showPDFEditorDialog } = require('../index');
showPDFEditorDialog('compress');
}
},
},
{ type: 'separator' },
{
@@ -408,21 +679,21 @@ function pdfEditorItems(mainWindow) {
click: () => {
const { showPDFEditorDialog } = require('../index');
showPDFEditorDialog('rotate');
}
},
},
{
label: 'Delete Pages...',
click: () => {
const { showPDFEditorDialog } = require('../index');
showPDFEditorDialog('delete');
}
},
},
{
label: 'Reorder Pages...',
click: () => {
const { showPDFEditorDialog } = require('../index');
showPDFEditorDialog('reorder');
}
},
},
{ type: 'separator' },
{
@@ -430,7 +701,7 @@ function pdfEditorItems(mainWindow) {
click: () => {
const { showPDFEditorDialog } = require('../index');
showPDFEditorDialog('watermark');
}
},
},
{ type: 'separator' },
{
@@ -441,23 +712,23 @@ function pdfEditorItems(mainWindow) {
click: () => {
const { showPDFEditorDialog } = require('../index');
showPDFEditorDialog('encrypt');
}
},
},
{
label: 'Remove Password...',
click: () => {
const { showPDFEditorDialog } = require('../index');
showPDFEditorDialog('decrypt');
}
},
},
{
label: 'Set Permissions...',
click: () => {
const { showPDFEditorDialog } = require('../index');
showPDFEditorDialog('permissions');
}
}
]
},
},
],
},
{ type: 'separator' },
{
@@ -465,8 +736,8 @@ function pdfEditorItems(mainWindow) {
click: () => {
const { showAboutDialog } = require('../index');
showAboutDialog();
}
}
},
},
];
}
@@ -478,8 +749,8 @@ function toolsItems(mainWindow) {
{ type: 'separator' },
{
label: 'Document Compare',
click: () => mainWindow.webContents.send('show-document-compare')
}
click: () => mainWindow.webContents.send('show-document-compare'),
},
];
}
@@ -490,7 +761,7 @@ function helpItems(mainWindow) {
click: () => {
const { showAboutDialog } = require('../index');
showAboutDialog();
}
},
},
{ type: 'separator' },
{
@@ -498,21 +769,21 @@ function helpItems(mainWindow) {
click: () => {
const { showDependenciesDialog } = require('../index');
showDependenciesDialog();
}
},
},
{ type: 'separator' },
{
label: 'Documentation',
click: () => shell.openExternal('https://github.com/amitwh/markdown-converter')
click: () => shell.openExternal('https://github.com/amitwh/markdown-converter'),
},
{
label: 'Report Issue',
click: () => shell.openExternal('https://github.com/amitwh/markdown-converter/issues')
click: () => shell.openExternal('https://github.com/amitwh/markdown-converter/issues'),
},
{
label: 'Check for Updates',
click: () => shell.openExternal('https://github.com/amitwh/markdown-converter/releases')
}
click: () => shell.openExternal('https://github.com/amitwh/markdown-converter/releases'),
},
];
}
@@ -524,5 +795,5 @@ module.exports = {
convertItems,
pdfEditorItems,
toolsItems,
helpItems
helpItems,
};
src/main/store.js
+1 -1
View File
@@ -25,7 +25,7 @@ const store = {
} catch {}
settings[key] = value;
fs.writeFileSync(settingsPath, JSON.stringify(settings, null, 2));
}
},
};
module.exports = store;
src/main/updater/crash-writer.js
+7 -2
View File
@@ -29,13 +29,18 @@ class CrashWriter {
const files = fs.readdirSync(this.dir).sort();
while (files.length > MAX_DUMPS) {
const oldest = files.shift();
try { fs.unlinkSync(path.join(this.dir, oldest)); } catch (_) { /* ignore */ }
try {
fs.unlinkSync(path.join(this.dir, oldest));
} catch (_) {
/* ignore */
}
}
}
list() {
if (!fs.existsSync(this.dir)) return [];
return fs.readdirSync(this.dir)
return fs
.readdirSync(this.dir)
.filter((f) => f.endsWith('.json'))
.sort()
.reverse()
src/main/updater/migration-transform.js
+39 -35
View File
@@ -2,42 +2,46 @@
// Kept in sync manually; if the renderer transform changes, update this too.
const { z } = require('zod');
const v4SettingsSchema = z.object({
theme: z.enum(['light', 'dark', 'auto']).default('auto'),
customCss: z.string().optional().nullable(),
recentFiles: z.array(z.string()).default([]),
editorFontSize: z.number().min(10).max(28).default(14),
keyBindings: z.record(z.string(), z.string()).optional(),
snippets: z.array(z.unknown()).default([]),
}).passthrough();
const v4SettingsSchema = z
.object({
theme: z.enum(['light', 'dark', 'auto']).default('auto'),
customCss: z.string().optional().nullable(),
recentFiles: z.array(z.string()).default([]),
editorFontSize: z.number().min(10).max(28).default(14),
keyBindings: z.record(z.string(), z.string()).optional(),
snippets: z.array(z.unknown()).default([]),
})
.passthrough();
const v5SettingsSchema = z.object({
fontSize: z.number().default(14),
tabSize: z.number().default(4),
lineNumbers: z.boolean().default(true),
wordWrap: z.boolean().default(true),
minimap: z.boolean().default(true),
theme: z.enum(['light', 'dark', 'system']).default('system'),
accentColor: z.string().default('brand'),
fontFamily: z.string().default('system'),
pdfFormat: z.string().default('a4'),
pdfMargins: z.string().default('normal'),
pdfEmbedFonts: z.boolean().default(true),
docxTemplate: z.string().default('standard'),
docxCustomTemplatePath: z.string().nullable().default(null),
replOpen: z.boolean().default(false),
breadcrumbSymbols: z.boolean().default(true),
htmlHighlightStyle: z.string().default('github'),
renderTablesAsAscii: z.boolean().default(false),
welcomeDismissed: z.boolean().default(false),
editorFontSize: z.number().default(14),
customCssPath: z.string().nullable().default(null),
userBindings: z.record(z.string(), z.string()).default({}),
updateChannel: z.enum(['github', 'concreteinfo']).default('github'),
autoCheckUpdates: z.boolean().default(true),
firstRun: z.boolean().default(true),
'migration.version': z.literal(5).optional(),
}).passthrough();
const v5SettingsSchema = z
.object({
fontSize: z.number().default(14),
tabSize: z.number().default(4),
lineNumbers: z.boolean().default(true),
wordWrap: z.boolean().default(true),
minimap: z.boolean().default(true),
theme: z.enum(['light', 'dark', 'system']).default('system'),
accentColor: z.string().default('brand'),
fontFamily: z.string().default('system'),
pdfFormat: z.string().default('a4'),
pdfMargins: z.string().default('normal'),
pdfEmbedFonts: z.boolean().default(true),
docxTemplate: z.string().default('standard'),
docxCustomTemplatePath: z.string().nullable().default(null),
replOpen: z.boolean().default(false),
breadcrumbSymbols: z.boolean().default(true),
htmlHighlightStyle: z.string().default('github'),
renderTablesAsAscii: z.boolean().default(false),
welcomeDismissed: z.boolean().default(false),
editorFontSize: z.number().default(14),
customCssPath: z.string().nullable().default(null),
userBindings: z.record(z.string(), z.string()).default({}),
updateChannel: z.enum(['github', 'concreteinfo']).default('github'),
autoCheckUpdates: z.boolean().default(true),
firstRun: z.boolean().default(true),
'migration.version': z.literal(5).optional(),
})
.passthrough();
const v5OnlyFields = ['updateChannel', 'autoCheckUpdates', 'firstRun'];
const v5ThemeValues = ['light', 'dark', 'system'];
src/main/updater/updater-service.js
+2 -1
View File
@@ -18,7 +18,8 @@ class UpdaterService extends EventEmitter {
au.on('update-downloaded', (info) => this._emit({ state: 'ready', version: info.version }));
au.on('update-not-available', () => this._emit({ state: 'idle' }));
au.on('error', (err) => {
const code = err && /ENOTFOUND|ETIMEDOUT|ECONNREFUSED/.test(err.message) ? 'NETWORK' : 'UNKNOWN';
const code =
err && /ENOTFOUND|ETIMEDOUT|ECONNREFUSED/.test(err.message) ? 'NETWORK' : 'UNKNOWN';
this._emit({ state: 'error', code });
});
}
src/main/utils/paths.js
+8 -4
View File
@@ -10,7 +10,7 @@ function getAllowedDirectories() {
app.getPath('desktop'),
app.getPath('downloads'),
app.getPath('home'),
process.cwd() // Current working directory
process.cwd(), // Current working directory
].filter(Boolean); // Remove any undefined paths
return dirs;
}
@@ -88,9 +88,13 @@ function resolveWritablePath(filePath) {
function isPathAccessible(resolvedPath) {
// Block access to sensitive system directories
const blockedPaths = [
'/etc/passwd', '/etc/shadow', '/root',
'C:\\Windows\\System32', 'C:\\Windows\\System',
'/System', '/private/etc'
'/etc/passwd',
'/etc/shadow',
'/root',
'C:\\Windows\\System32',
'C:\\Windows\\System',
'/System',
'/private/etc',
];
const normalizedPath = resolvedPath.toLowerCase();
src/main/window/index.js
+16 -11
View File
@@ -25,9 +25,9 @@ function createMainWindow() {
// on load and the renderer never gets the IPC bridge.
contextIsolation: true,
nodeIntegration: false,
spellcheck: true
spellcheck: true,
},
icon: path.join(__dirname, '../../../assets/icon.png')
icon: path.join(__dirname, '../../../assets/icon.png'),
});
// Dev (Vite): load the running dev server so .tsx is transformed on the fly.
@@ -54,7 +54,7 @@ function createMainWindow() {
console.error(
'[WINDOW] Renderer not found at',
rendererIndex,
'— did you run `npm run build:renderer` before packaging?',
'— did you run `npm run build:renderer` before packaging?'
);
}
}
@@ -84,18 +84,23 @@ function createMainWindow() {
// Add spell check suggestions
if (params.misspelledWord) {
for (const suggestion of params.dictionarySuggestions) {
ctxMenu.append(new MenuItem({
label: suggestion,
click: () => win.webContents.replaceMisspelling(suggestion)
}));
ctxMenu.append(
new MenuItem({
label: suggestion,
click: () => win.webContents.replaceMisspelling(suggestion),
})
);
}
if (params.dictionarySuggestions.length > 0) {
ctxMenu.append(new MenuItem({ type: 'separator' }));
}
ctxMenu.append(new MenuItem({
label: 'Add to Dictionary',
click: () => win.webContents.session.addWordToSpellCheckerDictionary(params.misspelledWord)
}));
ctxMenu.append(
new MenuItem({
label: 'Add to Dictionary',
click: () =>
win.webContents.session.addWordToSpellCheckerDictionary(params.misspelledWord),
})
);
ctxMenu.append(new MenuItem({ type: 'separator' }));
}
src/main/word-template/index.js
+611 -546
View File
File diff suppressed because it is too large Load Diff
src/plugins/built-in/_sample/manifest.json
+1 -3
View File
@@ -5,9 +5,7 @@
"description": "Demonstrates the plugin system. Safe to delete.",
"icon": "puzzle",
"extensionPoints": {
"commands": [
{ "id": "hello", "label": "Sample: Hello World", "shortcut": "" }
]
"commands": [{ "id": "hello", "label": "Sample: Hello World", "shortcut": "" }]
},
"settings": []
}
src/plugins/built-in/writing-studio/index.js
+69 -39
View File
@@ -9,7 +9,7 @@ class WritingStudioPlugin extends PluginAPI {
this.context = context;
this.sprintEngine = new SprintEngine({
onEvent: (name, data) => context.events.emit(name, data)
onEvent: (name, data) => context.events.emit(name, data),
});
this.goalTracker = new GoalTracker(context.settings);
this.snapshotManager = new SnapshotManager(context.settings);
@@ -17,14 +17,14 @@ class WritingStudioPlugin extends PluginAPI {
readFile: (p) => context.ipc.invoke('read-file', p),
writeFile: (p, c) => context.ipc.invoke('write-file', p, c),
fileExists: (p) => context.ipc.invoke('path-exists', p),
listDir: (p) => context.ipc.invoke('list-directory', p)
listDir: (p) => context.ipc.invoke('list-directory', p),
});
this._engines = {
sprint: this.sprintEngine,
goals: this.goalTracker,
snapshots: this.snapshotManager,
projects: this.projectManager
projects: this.projectManager,
};
this._registerCommands(context);
@@ -34,59 +34,89 @@ class WritingStudioPlugin extends PluginAPI {
_registerCommands(context) {
const { sprintEngine, snapshotManager, goalTracker } = this;
context.commands.register('start-sprint', 'Studio: Start Sprint', () => {
const duration = context.settings.get('sprintDuration') || 25;
const content = context.editor.getContent() || '';
const words = content.split(/\s+/).filter(Boolean).length;
sprintEngine.start(duration, words);
}, 'Ctrl+Alt+S');
context.commands.register(
'start-sprint',
'Studio: Start Sprint',
() => {
const duration = context.settings.get('sprintDuration') || 25;
const content = context.editor.getContent() || '';
const words = content.split(/\s+/).filter(Boolean).length;
sprintEngine.start(duration, words);
},
'Ctrl+Alt+S'
);
context.commands.register('stop-sprint', 'Studio: Stop Sprint', () => {
if (!sprintEngine.isActive()) return;
const content = context.editor.getContent() || '';
const words = content.split(/\s+/).filter(Boolean).length;
const result = sprintEngine.stop(words);
goalTracker.addWords(result.wordDelta);
context.events.emit('sprint:stopped', result);
}, 'Ctrl+Alt+Shift+S');
context.commands.register(
'stop-sprint',
'Studio: Stop Sprint',
() => {
if (!sprintEngine.isActive()) return;
const content = context.editor.getContent() || '';
const words = content.split(/\s+/).filter(Boolean).length;
const result = sprintEngine.stop(words);
goalTracker.addWords(result.wordDelta);
context.events.emit('sprint:stopped', result);
},
'Ctrl+Alt+Shift+S'
);
context.commands.register('take-snapshot', 'Studio: Take Snapshot', () => {
const content = context.editor.getContent() || '';
snapshotManager.create(content, 'manual');
context.events.emit('snapshot:created', {});
}, 'Ctrl+Alt+N');
context.commands.register(
'take-snapshot',
'Studio: Take Snapshot',
() => {
const content = context.editor.getContent() || '';
snapshotManager.create(content, 'manual');
context.events.emit('snapshot:created', {});
},
'Ctrl+Alt+N'
);
context.commands.register('restore-last-snapshot', 'Studio: Restore Last Snapshot', () => {
const snaps = snapshotManager.list();
if (snaps.length === 0) return;
const content = snapshotManager.restore(snaps[0].id);
context.editor.insertAtCursor(content);
}, 'Ctrl+Alt+Z');
context.commands.register(
'restore-last-snapshot',
'Studio: Restore Last Snapshot',
() => {
const snaps = snapshotManager.list();
if (snaps.length === 0) return;
const content = snapshotManager.restore(snaps[0].id);
context.editor.insertAtCursor(content);
},
'Ctrl+Alt+Z'
);
context.commands.register('new-project', 'Studio: New Project', () => {
context.events.emit('studio:new-project', {});
});
context.commands.register('compile-manuscript', 'Studio: Compile Manuscript', () => {
context.events.emit('studio:compile', {});
}, 'Ctrl+Alt+E');
context.commands.register(
'compile-manuscript',
'Studio: Compile Manuscript',
() => {
context.events.emit('studio:compile', {});
},
'Ctrl+Alt+E'
);
context.commands.register('proofread-document', 'Studio: Proofread Document', () => {
if (context.events.hasHandler('ai:analyze')) {
const content = context.editor.getContent() || '';
context.events.emit('ai:analyze', { text: content, type: 'grammar' });
}
}, 'Ctrl+Alt+G');
context.commands.register(
'proofread-document',
'Studio: Proofread Document',
() => {
if (context.events.hasHandler('ai:analyze')) {
const content = context.editor.getContent() || '';
context.events.emit('ai:analyze', { text: content, type: 'grammar' });
}
},
'Ctrl+Alt+G'
);
}
_registerStatusBar(context) {
context.statusBar.registerIndicator('word-goal', {
text: '0/1000',
tooltip: 'Daily word goal progress'
tooltip: 'Daily word goal progress',
});
context.statusBar.registerIndicator('sprint-timer', {
text: '',
tooltip: 'Writing sprint timer'
tooltip: 'Writing sprint timer',
});
}
src/plugins/built-in/writing-studio/manifest.json
+21 -4
View File
@@ -15,17 +15,34 @@
{ "id": "start-sprint", "label": "Studio: Start Sprint", "shortcut": "Ctrl+Alt+S" },
{ "id": "stop-sprint", "label": "Studio: Stop Sprint", "shortcut": "Ctrl+Alt+Shift+S" },
{ "id": "take-snapshot", "label": "Studio: Take Snapshot", "shortcut": "Ctrl+Alt+N" },
{ "id": "restore-last-snapshot", "label": "Studio: Restore Last Snapshot", "shortcut": "Ctrl+Alt+Z" },
{
"id": "restore-last-snapshot",
"label": "Studio: Restore Last Snapshot",
"shortcut": "Ctrl+Alt+Z"
},
{ "id": "new-project", "label": "Studio: New Project", "shortcut": "" },
{ "id": "compile-manuscript", "label": "Studio: Compile Manuscript", "shortcut": "Ctrl+Alt+E" },
{ "id": "proofread-document", "label": "Studio: Proofread Document", "shortcut": "Ctrl+Alt+G" }
{
"id": "compile-manuscript",
"label": "Studio: Compile Manuscript",
"shortcut": "Ctrl+Alt+E"
},
{
"id": "proofread-document",
"label": "Studio: Proofread Document",
"shortcut": "Ctrl+Alt+G"
}
],
"statusBar": { "indicators": ["sprint-timer", "word-goal"] }
},
"settings": [
{ "key": "dailyGoal", "type": "number", "default": 1000, "label": "Daily word goal" },
{ "key": "sprintDuration", "type": "number", "default": 25, "label": "Sprint duration (min)" },
{ "key": "autoSnapshotInterval", "type": "number", "default": 0, "label": "Auto-snapshot interval (min, 0=off)" },
{
"key": "autoSnapshotInterval",
"type": "number",
"default": 0,
"label": "Auto-snapshot interval (min, 0=off)"
},
{ "key": "maxSnapshots", "type": "number", "default": 50, "label": "Max snapshots to keep" }
]
}
src/plugins/built-in/writing-studio/panels/goals-panel.js
+3 -2
View File
@@ -29,7 +29,8 @@ function renderGoalsPanel(container, { engines, settings }) {
const row = document.createElement('div');
row.className = 'ws-stat-row';
const label = document.createElement('span');
label.textContent = progress.written.toLocaleString() + ' / ' + dailyGoal.toLocaleString() + ' words';
label.textContent =
progress.written.toLocaleString() + ' / ' + dailyGoal.toLocaleString() + ' words';
const pct = document.createElement('span');
pct.className = 'ws-pct';
pct.textContent = progress.pct + '%';
@@ -81,7 +82,7 @@ function renderGoalsPanel(container, { engines, settings }) {
const chart = document.createElement('div');
chart.className = 'ws-chart';
const maxWords = Math.max(...last30.map(d => d.words), 1);
const maxWords = Math.max(...last30.map((d) => d.words), 1);
for (const day of last30) {
const barEl = document.createElement('div');
const height = Math.max(2, (day.words / maxWords) * 60);
src/plugins/built-in/writing-studio/panels/manuscript-panel.js
+2 -1
View File
@@ -69,7 +69,8 @@ function renderManuscriptPanel(container, { engines, editor, settings }) {
const row = document.createElement('div');
row.className = 'ws-stat-row';
const label = document.createElement('span');
label.textContent = stats.totalWords.toLocaleString() + ' / ' + stats.targetWords.toLocaleString() + ' words';
label.textContent =
stats.totalWords.toLocaleString() + ' / ' + stats.targetWords.toLocaleString() + ' words';
const pct = document.createElement('span');
pct.className = 'ws-pct';
pct.textContent = stats.pctComplete + '%';
src/plugins/built-in/writing-studio/panels/proofread-panel.js
+5 -2
View File
@@ -42,7 +42,7 @@ function renderProofreadPanel(container, { events, editor }) {
if (result && result.issues) {
renderIssues(issuesList, result.issues);
}
}
},
});
});
}
@@ -80,7 +80,10 @@ function renderIssues(container, issues) {
const actions = document.createElement('div');
actions.className = 'ws-issue-actions';
for (const [action, label] of [['accept', 'Accept'], ['dismiss', 'Dismiss']]) {
for (const [action, label] of [
['accept', 'Accept'],
['dismiss', 'Dismiss'],
]) {
const actionBtn = document.createElement('button');
actionBtn.className = 'ws-btn ws-btn-sm';
actionBtn.textContent = label;
src/plugins/built-in/writing-studio/panels/snapshots-panel.js
+5 -1
View File
@@ -45,7 +45,11 @@ function renderSnapshotsPanel(container, { engines, editor }) {
const actions = document.createElement('div');
actions.className = 'ws-snapshot-actions';
for (const [action, text, cls] of [['restore', 'Restore', ''], ['diff', 'Diff', ''], ['delete', 'Delete', 'ws-btn-danger']]) {
for (const [action, text, cls] of [
['restore', 'Restore', ''],
['diff', 'Diff', ''],
['delete', 'Delete', 'ws-btn-danger'],
]) {
const actionBtn = document.createElement('button');
actionBtn.className = 'ws-btn ws-btn-sm' + (cls ? ' ' + cls : '');
actionBtn.textContent = text;
src/plugins/built-in/writing-studio/project-manager.js
+2 -2
View File
@@ -12,7 +12,7 @@ class ProjectManager {
type: opts.type || 'manuscript',
target: { words: opts.targetWords || 0, deadline: opts.deadline || null },
chapters: [],
metadata: opts.metadata || {}
metadata: opts.metadata || {},
};
this.fs.writeFile(dir + '/.project.json', JSON.stringify(project, null, 2));
return project;
@@ -66,7 +66,7 @@ class ProjectManager {
totalWords,
chapterCount: project.chapters.length,
targetWords: target,
pctComplete: target > 0 ? Math.min(100, Math.round((totalWords / target) * 100)) : 0
pctComplete: target > 0 ? Math.min(100, Math.round((totalWords / target) * 100)) : 0,
};
}
}
src/plugins/built-in/writing-studio/snapshot-manager.js
+9 -5
View File
@@ -24,7 +24,7 @@ class SnapshotManager {
timestamp: new Date().toISOString(),
content,
wordCount: content.split(/\s+/).filter(Boolean).length,
label
label,
};
snaps.unshift(snap);
this._saveAll(snaps);
@@ -36,7 +36,7 @@ class SnapshotManager {
}
getById(id) {
return this._getAll().find(s => s.id === id) || null;
return this._getAll().find((s) => s.id === id) || null;
}
restore(id) {
@@ -46,7 +46,7 @@ class SnapshotManager {
}
delete(id) {
const snaps = this._getAll().filter(s => s.id !== id);
const snaps = this._getAll().filter((s) => s.id !== id);
this._saveAll(snaps);
}
@@ -59,8 +59,12 @@ class SnapshotManager {
const newSet = new Set(newLines);
let added = 0;
let removed = 0;
for (const line of newLines) { if (!oldSet.has(line)) added++; }
for (const line of oldLines) { if (!newSet.has(line)) removed++; }
for (const line of newLines) {
if (!oldSet.has(line)) added++;
}
for (const line of oldLines) {
if (!newSet.has(line)) removed++;
}
return { added, removed };
}
src/plugins/built-in/writing-studio/sprint-engine.js
+3 -1
View File
@@ -40,7 +40,9 @@ class SprintEngine {
}
}
isActive() { return this._active; }
isActive() {
return this._active;
}
getRemaining() {
if (!this._active) return 0;
src/plugins/plugin-context.js
+15 -10
View File
@@ -12,10 +12,11 @@ class PluginContext {
* @param {object} deps.exportHooks - { preHooks: [], postHooks: [] }
*/
constructor(deps) {
const { pluginId, sidebar, commands, statusBar, eventBus, settings, editor, ipc, exportHooks } = deps;
const { pluginId, sidebar, commands, statusBar, eventBus, settings, editor, ipc, exportHooks } =
deps;
this.sidebar = {
registerPanel: (id, opts) => sidebar.registerPanel(`${pluginId}:${id}`, opts)
registerPanel: (id, opts) => sidebar.registerPanel(`${pluginId}:${id}`, opts),
};
this.commands = {
@@ -28,41 +29,45 @@ class PluginContext {
}
};
commands.register(`${pluginId}:${id}`, label, safeHandler, shortcut);
}
},
};
this.statusBar = {
registerIndicator: (id, opts) => statusBar.registerIndicator(`${pluginId}:${id}`, opts)
registerIndicator: (id, opts) => statusBar.registerIndicator(`${pluginId}:${id}`, opts),
};
this.settings = {
get: (key) => settings.get(`plugins.${pluginId}.${key}`),
set: (key, value) => settings.set(`plugins.${pluginId}.${key}`, value),
onChanged: (key, cb) => settings.onChanged(`plugins.${pluginId}.${key}`, cb)
onChanged: (key, cb) => settings.onChanged(`plugins.${pluginId}.${key}`, cb),
};
this.editor = {
getContent: () => editor.getContent(),
getSelection: () => editor.getSelection(),
insertAtCursor: (text) => editor.insertAtCursor(text),
onContentChanged: (cb) => editor.onContentChanged(cb)
onContentChanged: (cb) => editor.onContentChanged(cb),
};
this.events = {
on: (event, handler) => eventBus.on(event, handler),
off: (event, handler) => eventBus.off(event, handler),
emit: (event, payload) => eventBus.emit(event, payload),
hasHandler: (event) => eventBus.hasHandler(event)
hasHandler: (event) => eventBus.hasHandler(event),
};
this.ipc = {
invoke: (channel, ...args) => ipc.invoke(channel, ...args),
on: (channel, handler) => ipc.on(channel, handler)
on: (channel, handler) => ipc.on(channel, handler),
};
this.exports = {
registerPreHook: (handler) => { if (exportHooks) exportHooks.preHooks.push(handler); },
registerPostHook: (handler) => { if (exportHooks) exportHooks.postHooks.push(handler); }
registerPreHook: (handler) => {
if (exportHooks) exportHooks.preHooks.push(handler);
},
registerPostHook: (handler) => {
if (exportHooks) exportHooks.postHooks.push(handler);
},
};
}
}
src/plugins/plugin-loader.js
+5 -2
View File
@@ -35,7 +35,10 @@ class PluginLoader {
const loaded = require(indexPath);
PluginClass = loaded.Plugin || loaded.default || null;
} catch (err) {
console.error(`[PluginLoader] Failed to load index.js for "${manifest.id}":`, err.message);
console.error(
`[PluginLoader] Failed to load index.js for "${manifest.id}":`,
err.message
);
continue;
}
}
@@ -46,7 +49,7 @@ class PluginLoader {
description: manifest.description,
manifest,
PluginClass,
dir: pluginDir
dir: pluginDir,
});
this.loadedIds.add(manifest.id);
} catch (err) {
src/plugins/plugin-registry.js
+1 -1
View File
@@ -32,7 +32,7 @@ class PluginRegistry {
settings: this.deps.settings,
editor: this.deps.editor,
ipc: this.deps.ipc,
exportHooks: this.exportHooks
exportHooks: this.exportHooks,
});
try {
src/preload.js
+22 -15
View File
@@ -150,7 +150,7 @@ const ALLOWED_SEND_CHANNELS = [
// Plugin settings
'plugin-settings:get',
'plugin-settings:set'
'plugin-settings:set',
];
const ALLOWED_RECEIVE_CHANNELS = [
@@ -251,7 +251,7 @@ const ALLOWED_RECEIVE_CHANNELS = [
// File dialog / directory listing
'list-directory',
'pick-folder',
'pick-file'
'pick-file',
];
/**
@@ -361,12 +361,12 @@ contextBridge.exposeInMainWorld('electronAPI', {
move: (source, destination) => ipcRenderer.invoke('move-path', { source, destination }),
list: (dirPath) => ipcRenderer.invoke('list-directory', dirPath),
pickFolder: () => ipcRenderer.invoke('pick-folder'),
pickFile: () => ipcRenderer.invoke('pick-file')
pickFile: () => ipcRenderer.invoke('pick-file'),
},
// Theme Operations
theme: {
get: () => ipcRenderer.send('get-theme')
get: () => ipcRenderer.send('get-theme'),
},
// Print Operations
@@ -378,7 +378,7 @@ contextBridge.exposeInMainWorld('electronAPI', {
// Export Operations
export: {
withOptions: (format, options) => ipcRenderer.send('export-with-options', { format, options }),
spreadsheet: (content, format) => ipcRenderer.send('export-spreadsheet', { content, format })
spreadsheet: (content, format) => ipcRenderer.send('export-spreadsheet', { content, format }),
},
// Batch Conversion
@@ -386,7 +386,7 @@ contextBridge.exposeInMainWorld('electronAPI', {
convert: (inputFolder, outputFolder, format, options) => {
ipcRenderer.send('batch-convert', { inputFolder, outputFolder, format, options });
},
selectFolder: (type) => ipcRenderer.send('select-folder', type)
selectFolder: (type) => ipcRenderer.send('select-folder', type),
},
// Universal Converter
@@ -395,8 +395,14 @@ contextBridge.exposeInMainWorld('electronAPI', {
ipcRenderer.send('universal-convert', { tool, fromFormat, toFormat, filePath });
},
convertBatch: (tool, fromFormat, toFormat, inputFolder, outputFolder) => {
ipcRenderer.send('universal-convert-batch', { tool, fromFormat, toFormat, inputFolder, outputFolder });
}
ipcRenderer.send('universal-convert-batch', {
tool,
fromFormat,
toFormat,
inputFolder,
outputFolder,
});
},
},
// Header/Footer Operations
@@ -404,22 +410,23 @@ contextBridge.exposeInMainWorld('electronAPI', {
getSettings: () => ipcRenderer.send('get-header-footer-settings'),
saveSettings: (settings) => ipcRenderer.send('save-header-footer-settings', settings),
browseLogo: (position) => ipcRenderer.send('browse-header-footer-logo', position),
saveLogo: (position, filePath) => ipcRenderer.send('save-header-footer-logo', { position, filePath }),
clearLogo: (position) => ipcRenderer.send('clear-header-footer-logo', position)
saveLogo: (position, filePath) =>
ipcRenderer.send('save-header-footer-logo', { position, filePath }),
clearLogo: (position) => ipcRenderer.send('clear-header-footer-logo', position),
},
// Page Settings
page: {
getSettings: () => ipcRenderer.send('get-page-settings'),
updateSettings: (settings) => ipcRenderer.send('update-page-settings', settings),
setCustomStartPage: (pageNumber) => ipcRenderer.send('set-custom-start-page', pageNumber)
setCustomStartPage: (pageNumber) => ipcRenderer.send('set-custom-start-page', pageNumber),
},
// PDF Operations
pdf: {
processOperation: (data) => ipcRenderer.send('process-pdf-operation', data),
getPageCount: (filePath) => ipcRenderer.send('get-pdf-page-count', filePath),
selectFolder: (inputId) => ipcRenderer.send('select-pdf-folder', inputId)
selectFolder: (inputId) => ipcRenderer.send('select-pdf-folder', inputId),
},
// Image Converter Operations
@@ -428,7 +435,7 @@ contextBridge.exposeInMainWorld('electronAPI', {
batchConvert: (data) => ipcRenderer.send('image-batch-convert', data),
resize: (data) => ipcRenderer.send('image-resize', data),
compress: (data) => ipcRenderer.send('image-compress', data),
rotate: (data) => ipcRenderer.send('image-rotate', data)
rotate: (data) => ipcRenderer.send('image-rotate', data),
},
// Audio Converter Operations
@@ -437,7 +444,7 @@ contextBridge.exposeInMainWorld('electronAPI', {
batchConvert: (data) => ipcRenderer.send('audio-batch-convert', data),
extract: (data) => ipcRenderer.send('audio-extract', data),
trim: (data) => ipcRenderer.send('audio-trim', data),
merge: (data) => ipcRenderer.send('audio-merge', data)
merge: (data) => ipcRenderer.send('audio-merge', data),
},
// Video Converter Operations
@@ -447,7 +454,7 @@ contextBridge.exposeInMainWorld('electronAPI', {
compress: (data) => ipcRenderer.send('video-compress', data),
trim: (data) => ipcRenderer.send('video-trim', data),
extractFrames: (data) => ipcRenderer.send('video-frames', data),
toGif: (data) => ipcRenderer.send('video-gif', data)
toGif: (data) => ipcRenderer.send('video-gif', data),
},
getAppVersion: () => ipcRenderer.invoke('get-app-version'),
src/renderer/components/FirstRunWizard.tsx
+49 -9
View File
@@ -5,7 +5,8 @@ import { useSettingsStore } from '@/stores/settings-store';
const TEMPLATES = {
blank: '',
readme: '# Project\n\nDescription.\n\n## Usage\n\n```\nnpm install\n```\n',
meeting: '# Meeting Notes — YYYY-MM-DD\n\n## Attendees\n\n- \n## Agenda\n\n1. \n\n## Action items\n\n- [ ] \n',
meeting:
'# Meeting Notes — YYYY-MM-DD\n\n## Attendees\n\n- \n## Agenda\n\n1. \n\n## Action items\n\n- [ ] \n',
blog: '# Title\n\n*Subtitle*\n\nLorem ipsum.\n\n---\n\n## Section 1\n',
};
@@ -23,7 +24,12 @@ export function FirstRunWizard() {
const close = () => setFirstRun(false);
return (
<div data-testid="first-run-wizard" role="dialog" aria-modal="true" className="fixed inset-0 z-50 bg-black/40 flex items-center justify-center">
<div
data-testid="first-run-wizard"
role="dialog"
aria-modal="true"
className="fixed inset-0 z-50 bg-black/40 flex items-center justify-center"
>
<div className="bg-white dark:bg-neutral-900 rounded-lg p-6 w-[28rem] shadow-xl">
{step === 0 && (
<div>
@@ -31,7 +37,12 @@ export function FirstRunWizard() {
<div className="flex gap-2 mb-4">
{(['light', 'dark', 'system'] as const).map((t) => (
<label key={t} className="flex items-center gap-1">
<input type="radio" name="theme" checked={theme === t} onChange={() => setSetting('theme', t)} />
<input
type="radio"
name="theme"
checked={theme === t}
onChange={() => setSetting('theme', t)}
/>
{t}
</label>
))}
@@ -43,11 +54,21 @@ export function FirstRunWizard() {
<h2 className="text-lg font-semibold mb-2">Update channel</h2>
<div className="flex flex-col gap-2 mb-4">
<label className="flex items-center gap-2">
<input type="radio" name="channel" checked={updateChannel === 'github'} onChange={() => setSetting('updateChannel', 'github')} />
<input
type="radio"
name="channel"
checked={updateChannel === 'github'}
onChange={() => setSetting('updateChannel', 'github')}
/>
GitHub Releases (public)
</label>
<label className="flex items-center gap-2">
<input type="radio" name="channel" checked={updateChannel === 'concreteinfo'} onChange={() => setSetting('updateChannel', 'concreteinfo')} />
<input
type="radio"
name="channel"
checked={updateChannel === 'concreteinfo'}
onChange={() => setSetting('updateChannel', 'concreteinfo')}
/>
ConcreteInfo self-hosted
</label>
</div>
@@ -56,7 +77,11 @@ export function FirstRunWizard() {
{step === 2 && (
<div>
<h2 className="text-lg font-semibold mb-2">Starter template</h2>
<select value={template} onChange={(e) => setTemplate(e.target.value as any)} className="border rounded px-2 py-1 w-full mb-4">
<select
value={template}
onChange={(e) => setTemplate(e.target.value as any)}
className="border rounded px-2 py-1 w-full mb-4"
>
<option value="blank">Blank</option>
<option value="readme">README</option>
<option value="meeting">Meeting notes</option>
@@ -65,13 +90,28 @@ export function FirstRunWizard() {
</div>
)}
<div className="flex justify-between items-center mt-4">
<button onClick={close} className="text-sm text-neutral-500">Skip</button>
<button onClick={close} className="text-sm text-neutral-500">
Skip
</button>
<div className="flex gap-2">
{step > 0 && <button onClick={() => setStep(step - 1)}>Back</button>}
{step < 2 ? (
<button onClick={() => setStep(step + 1)} className="px-3 py-1 rounded bg-brand text-white">Next</button>
<button
onClick={() => setStep(step + 1)}
className="px-3 py-1 rounded bg-brand text-white"
>
Next
</button>
) : (
<button onClick={() => { useAppStore.getState().newBuffer(TEMPLATES[template]); close(); }} className="px-3 py-1 rounded bg-brand text-white">Done</button>
<button
onClick={() => {
useAppStore.getState().newBuffer(TEMPLATES[template]);
close();
}}
className="px-3 py-1 rounded bg-brand text-white"
>
Done
</button>
)}
</div>
</div>
src/renderer/components/UpdateBanner.tsx
+35 -6
View File
@@ -9,9 +9,22 @@ export function UpdateBanner() {
if (state === 'error') {
return (
<div data-testid="update-banner" role="status" className="bg-amber-50 border-b border-amber-200 px-4 py-2 text-sm">
<div
data-testid="update-banner"
role="status"
className="bg-amber-50 border-b border-amber-200 px-4 py-2 text-sm"
>
Couldn't check for updates.{' '}
<button onClick={async () => { try { await check(); } catch (e: any) { toast.error(e.message); } }} className="underline">
<button
onClick={async () => {
try {
await check();
} catch (e: any) {
toast.error(e.message);
}
}}
className="underline"
>
Try again
</button>
</div>
@@ -20,7 +33,10 @@ export function UpdateBanner() {
if (state === 'available') {
return (
<div data-testid="update-banner" className="bg-blue-50 border-b border-blue-200 px-4 py-2 text-sm">
<div
data-testid="update-banner"
className="bg-blue-50 border-b border-blue-200 px-4 py-2 text-sm"
>
A new version (v{version}) is available.{' '}
<button onClick={() => useUpdaterStore.getState().check()} className="underline">
Download now
@@ -31,7 +47,10 @@ export function UpdateBanner() {
if (state === 'downloading') {
return (
<div data-testid="update-banner" className="bg-blue-50 border-b border-blue-200 px-4 py-2 text-sm">
<div
data-testid="update-banner"
className="bg-blue-50 border-b border-blue-200 px-4 py-2 text-sm"
>
Downloading update… {Math.round(percent)}%
</div>
);
@@ -39,9 +58,19 @@ export function UpdateBanner() {
if (state === 'ready') {
return (
<div data-testid="update-banner" className="bg-green-50 border-b border-green-200 px-4 py-2 text-sm flex items-center gap-3">
<div
data-testid="update-banner"
className="bg-green-50 border-b border-green-200 px-4 py-2 text-sm flex items-center gap-3"
>
<span>v{version} is ready.</span>
<button onClick={() => ipc.app.openExternal(`https://github.com/amitwh/markdown-converter/releases/tag/v${version}`)} className="underline">
<button
onClick={() =>
ipc.app.openExternal(
`https://github.com/amitwh/markdown-converter/releases/tag/v${version}`
)
}
className="underline"
>
View release notes
</button>
<button onClick={install} className="px-3 py-1 rounded bg-brand text-white">
src/renderer/components/editor/CodeMirrorEditor.tsx
+21 -5
View File
@@ -1,6 +1,12 @@
import { useEffect, useRef, useState } from 'react';
import { EditorState, Compartment } from '@codemirror/state';
import { EditorView, keymap, lineNumbers, highlightActiveLine, drawSelection } from '@codemirror/view';
import {
EditorView,
keymap,
lineNumbers,
highlightActiveLine,
drawSelection,
} from '@codemirror/view';
import { defaultKeymap, history, historyKeymap, indentWithTab } from '@codemirror/commands';
import { markdown, markdownLanguage } from '@codemirror/lang-markdown';
import { searchKeymap, highlightSelectionMatches } from '@codemirror/search';
@@ -46,8 +52,16 @@ export function CodeMirrorEditor({ bufferId, initialContent, onChange, onCursorC
drawSelection(),
markdown({ base: markdownLanguage, codeLanguages: [] }),
autocompletion(),
keymap.of([...defaultKeymap, ...historyKeymap, ...searchKeymap, ...completionKeymap, indentWithTab]),
themeCompartment.current.of(resolvedTheme === 'dark' ? [oneDark] : [lightTheme, lightHighlight]),
keymap.of([
...defaultKeymap,
...historyKeymap,
...searchKeymap,
...completionKeymap,
indentWithTab,
]),
themeCompartment.current.of(
resolvedTheme === 'dark' ? [oneDark] : [lightTheme, lightHighlight]
),
EditorView.lineWrapping,
EditorView.updateListener.of((v) => {
if (v.docChanged) {
@@ -73,7 +87,7 @@ export function CodeMirrorEditor({ bufferId, initialContent, onChange, onCursorC
const denom = el.scrollHeight - el.clientHeight;
setScrollRatio(denom > 0 ? el.scrollTop / denom : 0);
setVisibleRatio(
el.clientHeight > 0 ? Math.min(1, el.clientHeight / el.scrollHeight) : 1,
el.clientHeight > 0 ? Math.min(1, el.clientHeight / el.scrollHeight) : 1
);
return false;
},
@@ -104,7 +118,9 @@ export function CodeMirrorEditor({ bufferId, initialContent, onChange, onCursorC
return (
<div className="relative h-full overflow-hidden">
<div ref={ref} className="h-full overflow-hidden" />
{minimap && <Minimap content={initialContent} scrollRatio={scrollRatio} visibleRatio={visibleRatio} />}
{minimap && (
<Minimap content={initialContent} scrollRatio={scrollRatio} visibleRatio={visibleRatio} />
)}
</div>
);
}
src/renderer/components/editor/EditorPane.tsx
+1 -5
View File
@@ -22,11 +22,7 @@ export function EditorPane() {
return (
<div className="h-full">
<CodeMirrorEditor
key={buf.id}
bufferId={buf.id}
initialContent={buf.content}
/>
<CodeMirrorEditor key={buf.id} bufferId={buf.id} initialContent={buf.content} />
</div>
);
}
src/renderer/components/editor/Minimap.tsx
+2 -2
View File
@@ -1,7 +1,7 @@
interface Props {
content: string;
scrollRatio?: number; // 0-1, where the viewport is
visibleRatio?: number; // 0-1, what fraction of content is visible
scrollRatio?: number; // 0-1, where the viewport is
visibleRatio?: number; // 0-1, what fraction of content is visible
}
export function Minimap({ content, scrollRatio = 0, visibleRatio = 1 }: Props) {
src/renderer/components/layout/AppShell.tsx
+10 -3
View File
@@ -10,7 +10,10 @@ import { useAppStore } from '@/stores/app-store';
import { ResizablePanelGroup, ResizablePanel, ResizableHandle } from '@/components/ui/resizable';
import { useFileShortcuts } from '@/hooks/use-file-shortcuts';
import { useRestoreLastFolder } from '@/hooks/use-restore-last-folder';
import { useRegisterMenuCommands, useBridgeNativeMenu } from '@/lib/commands/register-menu-commands';
import {
useRegisterMenuCommands,
useBridgeNativeMenu,
} from '@/lib/commands/register-menu-commands';
import { useZenMode } from '@/hooks/use-zen-mode';
export function AppShell() {
@@ -27,7 +30,9 @@ export function AppShell() {
<main className="h-screen w-screen overflow-hidden bg-background">
<ResizablePanelGroup
direction="horizontal"
onLayoutChange={(sizes) => setPaneSizes({ sidebar: 0, editor: sizes[0], preview: sizes[1] })}
onLayoutChange={(sizes) =>
setPaneSizes({ sidebar: 0, editor: sizes[0], preview: sizes[1] })
}
>
<ResizablePanel defaultSize={previewVisible ? 50 : 100} minSize={20}>
<section className="h-full bg-background">
@@ -58,7 +63,9 @@ export function AppShell() {
<main className="flex-1 overflow-hidden">
<ResizablePanelGroup
direction="horizontal"
onLayoutChange={(sizes) => setPaneSizes({ sidebar: sizes[0], editor: sizes[1], preview: sizes[2] })}
onLayoutChange={(sizes) =>
setPaneSizes({ sidebar: sizes[0], editor: sizes[1], preview: sizes[2] })
}
>
{sidebarVisible && (
<>
src/renderer/components/layout/Breadcrumb.tsx
+3 -1
View File
@@ -27,7 +27,9 @@ export function Breadcrumb() {
className="flex items-center gap-1 hover:text-foreground"
>
<span aria-hidden="true">›</span>
<span className="truncate">{'#'.repeat(h.level)} {h.text}</span>
<span className="truncate">
{'#'.repeat(h.level)} {h.text}
</span>
</button>
))}
</nav>
src/renderer/components/layout/StatusBar.tsx
+3 -1
View File
@@ -17,7 +17,9 @@ export function StatusBar() {
<span>UTF-8</span>
</div>
<div className="flex items-center gap-4">
<span>Ln {cursor.line}, Col {cursor.column}</span>
<span>
Ln {cursor.line}, Col {cursor.column}
</span>
<span>Markdown</span>
</div>
</footer>
src/renderer/components/layout/TabBar.tsx
+1 -5
View File
@@ -7,11 +7,7 @@ import {
closestCenter,
type DragEndEvent,
} from '@dnd-kit/core';
import {
SortableContext,
horizontalListSortingStrategy,
useSortable,
} from '@dnd-kit/sortable';
import { SortableContext, horizontalListSortingStrategy, useSortable } from '@dnd-kit/sortable';
import { CSS } from '@dnd-kit/utilities';
import { useFileStore, type OpenTab } from '@/stores/file-store';
import { cn } from '@/lib/utils';
src/renderer/components/modals/AboutDialog.tsx
+8 -1
View File
@@ -1,5 +1,12 @@
import { useEffect, useState } from 'react';
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
import { Button } from '@/components/ui/button';
import { ipc } from '@/lib/ipc';
import { useAppStore } from '@/stores/app-store';
src/renderer/components/modals/AboutSettings.tsx
+8 -2
View File
@@ -18,7 +18,10 @@ export function AboutSettings() {
<a
href="https://github.com/amitwh/markdown-converter"
className="text-brand hover:underline"
onClick={(e) => { e.preventDefault(); ipc.app.openExternal('https://github.com/amitwh/markdown-converter'); }}
onClick={(e) => {
e.preventDefault();
ipc.app.openExternal('https://github.com/amitwh/markdown-converter');
}}
>
GitHub repository
</a>
@@ -27,7 +30,10 @@ export function AboutSettings() {
<a
href="https://concreteinfo.co.in"
className="text-brand hover:underline"
onClick={(e) => { e.preventDefault(); ipc.app.openExternal('https://concreteinfo.co.in'); }}
onClick={(e) => {
e.preventDefault();
ipc.app.openExternal('https://concreteinfo.co.in');
}}
>
ConcreteInfo
</a>
src/renderer/components/modals/AsciiGeneratorDialog.tsx
+37 -9
View File
@@ -1,8 +1,21 @@
import { useState, useEffect } from 'react';
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
import { Button } from '@/components/ui/button';
import { Label } from '@/components/ui/label';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from '@/components/ui/select';
import { Textarea } from '@/components/ui/textarea';
import { useAppStore } from '@/stores/app-store';
import { toast } from '@/lib/toast';
@@ -17,9 +30,15 @@ export function AsciiGeneratorDialog() {
useEffect(() => {
let cancelled = false;
figletText(text || ' ', font)
.then((result) => { if (!cancelled) setOutput(result); })
.catch(() => { if (!cancelled) setOutput('(render error)'); });
return () => { cancelled = true; };
.then((result) => {
if (!cancelled) setOutput(result);
})
.catch(() => {
if (!cancelled) setOutput('(render error)');
});
return () => {
cancelled = true;
};
}, [text, font]);
const handleCopy = async () => {
@@ -52,23 +71,32 @@ export function AsciiGeneratorDialog() {
<div>
<Label htmlFor="ascii-font">Font</Label>
<Select value={font} onValueChange={(v) => setFont(v as FigletFont)}>
<SelectTrigger id="ascii-font" aria-label="Font"><SelectValue /></SelectTrigger>
<SelectTrigger id="ascii-font" aria-label="Font">
<SelectValue />
</SelectTrigger>
<SelectContent>
{FIGLET_FONTS.map((f) => (
<SelectItem key={f} value={f}>{f}</SelectItem>
<SelectItem key={f} value={f}>
{f}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
<div>
<Label>Output</Label>
<pre className="overflow-auto rounded border border-border bg-card/30 p-3 text-xs" data-testid="ascii-output">
<pre
className="overflow-auto rounded border border-border bg-card/30 p-3 text-xs"
data-testid="ascii-output"
>
{output}
</pre>
</div>
</div>
<DialogFooter>
<Button variant="ghost" onClick={closeModal}>Close</Button>
<Button variant="ghost" onClick={closeModal}>
Close
</Button>
<Button onClick={handleCopy}>Copy</Button>
</DialogFooter>
</DialogContent>
src/renderer/components/modals/ConfirmDialog.tsx
+17 -2
View File
@@ -1,10 +1,25 @@
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
import { Button } from '@/components/ui/button';
import { useAppStore, type ConfirmProps } from '@/stores/app-store';
export function ConfirmDialog(props: ConfirmProps) {
const closeModal = useAppStore((s) => s.closeModal);
const { title, body, confirmLabel = 'Confirm', cancelLabel = 'Cancel', destructive, onConfirm, onCancel } = props;
const {
title,
body,
confirmLabel = 'Confirm',
cancelLabel = 'Cancel',
destructive,
onConfirm,
onCancel,
} = props;
const handleConfirm = async () => {
await onConfirm();
src/renderer/components/modals/CrashReportModal.tsx
+30 -7
View File
@@ -12,29 +12,52 @@ export function CrashReportModal({ onClose }: { onClose: () => void }) {
const [dumps, setDumps] = useState<Dump[]>([]);
const refresh = async () => setDumps(await ipc.crash.read());
useEffect(() => { refresh(); }, []);
useEffect(() => {
refresh();
}, []);
return (
<div role="dialog" aria-modal="true" data-testid="crash-report-modal" className="fixed inset-0 z-50 bg-black/40 flex items-center justify-center">
<div
role="dialog"
aria-modal="true"
data-testid="crash-report-modal"
className="fixed inset-0 z-50 bg-black/40 flex items-center justify-center"
>
<div className="bg-white dark:bg-neutral-900 rounded-lg p-6 w-[36rem] max-h-[80vh] overflow-y-auto shadow-xl">
<header className="flex items-center justify-between mb-4">
<h2 className="text-lg font-semibold">Crash reports</h2>
<button onClick={onClose} aria-label="Close">×</button>
<button onClick={onClose} aria-label="Close">
×
</button>
</header>
<button onClick={() => ipc.crash.openDir()} className="mb-4 px-3 py-1 text-sm border rounded">
<button
onClick={() => ipc.crash.openDir()}
className="mb-4 px-3 py-1 text-sm border rounded"
>
Open dump folder
</button>
{dumps.length === 0 ? (
<p data-testid="empty-state" className="text-neutral-500">No crashes recorded — nice work!</p>
<p data-testid="empty-state" className="text-neutral-500">
No crashes recorded — nice work!
</p>
) : (
<ul className="space-y-2">
{dumps.map((d) => (
<li key={d.filename} className="border rounded p-2 text-sm flex justify-between items-start gap-2">
<li
key={d.filename}
className="border rounded p-2 text-sm flex justify-between items-start gap-2"
>
<div>
<div className="font-mono text-xs text-neutral-500">{d.timestamp}</div>
<div>{d.message ?? '(no message)'}</div>
</div>
<button onClick={async () => { await ipc.crash.delete(d.filename); refresh(); }} className="text-red-600 text-xs">
<button
onClick={async () => {
await ipc.crash.delete(d.filename);
refresh();
}}
className="text-red-600 text-xs"
>
Delete
</button>
</li>
src/renderer/components/modals/EditorSettings.tsx
+37 -7
View File
@@ -1,7 +1,13 @@
import { useSettingsStore } from '@/stores/settings-store';
import { Label } from '@/components/ui/label';
import { Slider } from '@/components/ui/slider';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from '@/components/ui/select';
import { Switch } from '@/components/ui/switch';
export function EditorSettings() {
@@ -11,12 +17,24 @@ export function EditorSettings() {
<div className="space-y-5 text-sm">
<div>
<Label htmlFor="editor-font-size">Font size: {fontSize}px</Label>
<Slider id="editor-font-size" min={10} max={24} step={1} value={[fontSize]} onValueChange={([v]) => setSetting('fontSize', v)} />
<Slider
id="editor-font-size"
min={10}
max={24}
step={1}
value={[fontSize]}
onValueChange={([v]) => setSetting('fontSize', v)}
/>
</div>
<div>
<Label htmlFor="editor-tab-size">Tab size</Label>
<Select value={String(tabSize)} onValueChange={(v) => setSetting('tabSize', Number(v) as 2 | 4 | 8)}>
<SelectTrigger id="editor-tab-size" aria-label="Tab size"><SelectValue /></SelectTrigger>
<Select
value={String(tabSize)}
onValueChange={(v) => setSetting('tabSize', Number(v) as 2 | 4 | 8)}
>
<SelectTrigger id="editor-tab-size" aria-label="Tab size">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="2">2 spaces</SelectItem>
<SelectItem value="4">4 spaces</SelectItem>
@@ -26,15 +44,27 @@ export function EditorSettings() {
</div>
<label className="flex items-center justify-between">
<span>Line numbers</span>
<Switch checked={lineNumbers} onCheckedChange={(c) => setSetting('lineNumbers', c)} aria-label="Line numbers" />
<Switch
checked={lineNumbers}
onCheckedChange={(c) => setSetting('lineNumbers', c)}
aria-label="Line numbers"
/>
</label>
<label className="flex items-center justify-between">
<span>Word wrap</span>
<Switch checked={wordWrap} onCheckedChange={(c) => setSetting('wordWrap', c)} aria-label="Word wrap" />
<Switch
checked={wordWrap}
onCheckedChange={(c) => setSetting('wordWrap', c)}
aria-label="Word wrap"
/>
</label>
<label className="flex items-center justify-between">
<span>Minimap</span>
<Switch checked={minimap} onCheckedChange={(c) => setSetting('minimap', c)} aria-label="Minimap" />
<Switch
checked={minimap}
onCheckedChange={(c) => setSetting('minimap', c)}
aria-label="Minimap"
/>
</label>
</div>
);
src/renderer/components/modals/ExportBatchDialog.tsx
+38 -8
View File
@@ -1,7 +1,19 @@
import { useState } from 'react';
import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import {
Dialog,
DialogContent,
DialogDescription,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
import { Label } from '@/components/ui/label';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from '@/components/ui/select';
import { useAppStore } from '@/stores/app-store';
import { ipc } from '@/lib/ipc';
import { toast } from '@/lib/toast';
@@ -46,7 +58,9 @@ export function ExportBatchDialog({ sourcePaths }: { sourcePaths: string[] }) {
<div>
<Label htmlFor="batch-format">Format</Label>
<Select value={format} onValueChange={(v) => setFormat(v as any)}>
<SelectTrigger id="batch-format" aria-label="Format"><SelectValue /></SelectTrigger>
<SelectTrigger id="batch-format" aria-label="Format">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="pdf">PDF</SelectItem>
<SelectItem value="docx">DOCX</SelectItem>
@@ -58,24 +72,40 @@ export function ExportBatchDialog({ sourcePaths }: { sourcePaths: string[] }) {
<div>
<Label htmlFor="batch-concurrency">Concurrency</Label>
<Select value={String(concurrency)} onValueChange={(v) => setConcurrency(Number(v))}>
<SelectTrigger id="batch-concurrency" aria-label="Concurrency"><SelectValue /></SelectTrigger>
<SelectTrigger id="batch-concurrency" aria-label="Concurrency">
<SelectValue />
</SelectTrigger>
<SelectContent>
{[1, 2, 4, 8, 16].map((n) => (
<SelectItem key={n} value={String(n)}>{n}</SelectItem>
<SelectItem key={n} value={String(n)}>
{n}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
<div className="max-h-40 overflow-auto rounded border border-border bg-card/20 p-2 text-xs">
{sourcePaths.map((p) => <div key={p} className="truncate">{p}</div>)}
{sourcePaths.map((p) => (
<div key={p} className="truncate">
{p}
</div>
))}
</div>
{error && (
<div role="alert" className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive">
<div
role="alert"
className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive"
>
{error}
</div>
)}
</div>
<ExportDialogFooter onCancel={closeModal} onSubmit={handleSubmit} submitting={submitting} submitLabel="Export" />
<ExportDialogFooter
onCancel={closeModal}
onSubmit={handleSubmit}
submitting={submitting}
submitLabel="Export"
/>
</DialogContent>
</Dialog>
);
src/renderer/components/modals/ExportDialogFooter.tsx
+7 -1
View File
@@ -9,7 +9,13 @@ interface Props {
submitDisabled?: boolean;
}
export function ExportDialogFooter({ onCancel, onSubmit, submitting, submitLabel, submitDisabled }: Props) {
export function ExportDialogFooter({
onCancel,
onSubmit,
submitting,
submitLabel,
submitDisabled,
}: Props) {
return (
<DialogFooter>
<Button variant="ghost" onClick={onCancel} disabled={submitting}>
src/renderer/components/modals/ExportDocxDialog.tsx
+42 -10
View File
@@ -1,8 +1,20 @@
import { useState } from 'react';
import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import {
Dialog,
DialogContent,
DialogDescription,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
import { Checkbox } from '@/components/ui/checkbox';
import { Label } from '@/components/ui/label';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from '@/components/ui/select';
import { useAppStore } from '@/stores/app-store';
import { useSettingsStore } from '@/stores/settings-store';
import { useExportSource } from '@/hooks/use-export-source';
@@ -21,12 +33,18 @@ export function ExportDocxDialog({ sourcePath }: { sourcePath: string }) {
const [error, setError] = useState<string | null>(null);
const handleSubmit = async () => {
if (!source) { setError('No file open.'); return; }
if (!source) {
setError('No file open.');
return;
}
setSubmitting(true);
setError(null);
try {
const blob = await generateDocx({ source: source.source, title: source.title });
const saveResult = await ipc.app.showSaveDialog?.({ title: 'Save as Word document', defaultPath: source.path.replace(/\.md$/, '.docx') });
const saveResult = await ipc.app.showSaveDialog?.({
title: 'Save as Word document',
defaultPath: source.path.replace(/\.md$/, '.docx'),
});
if (!saveResult?.ok || !saveResult.data) {
setSubmitting(false);
return;
@@ -59,7 +77,9 @@ export function ExportDocxDialog({ sourcePath }: { sourcePath: string }) {
<div>
<Label htmlFor="docx-template">Template</Label>
<Select value={template} onValueChange={(v) => setTemplate(v as any)}>
<SelectTrigger id="docx-template" aria-label="Template"><SelectValue /></SelectTrigger>
<SelectTrigger id="docx-template" aria-label="Template">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="standard">Standard</SelectItem>
<SelectItem value="minimal">Minimal</SelectItem>
@@ -67,21 +87,33 @@ export function ExportDocxDialog({ sourcePath }: { sourcePath: string }) {
</SelectContent>
</Select>
<p className="mt-1 text-xs text-muted-foreground">
The renderer-side export produces the same document for all three
template choices; the option is preserved for future stylesheets.
The renderer-side export produces the same document for all three template choices;
the option is preserved for future stylesheets.
</p>
</div>
<label className="flex items-center gap-2">
<Checkbox checked={ascii} onCheckedChange={(c) => setAscii(!!c)} aria-label="ASCII tables" />
<Checkbox
checked={ascii}
onCheckedChange={(c) => setAscii(!!c)}
aria-label="ASCII tables"
/>
Render tables as ASCII
</label>
{error && (
<div role="alert" className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive">
<div
role="alert"
className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive"
>
{error}
</div>
)}
</div>
<ExportDialogFooter onCancel={closeModal} onSubmit={handleSubmit} submitting={submitting} submitLabel="Export" />
<ExportDialogFooter
onCancel={closeModal}
onSubmit={handleSubmit}
submitting={submitting}
submitLabel="Export"
/>
</DialogContent>
</Dialog>
);
src/renderer/components/modals/ExportHtmlDialog.tsx
+45 -9
View File
@@ -1,8 +1,20 @@
import { useState } from 'react';
import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import {
Dialog,
DialogContent,
DialogDescription,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
import { Checkbox } from '@/components/ui/checkbox';
import { Label } from '@/components/ui/label';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from '@/components/ui/select';
import { useAppStore } from '@/stores/app-store';
import { useSettingsStore } from '@/stores/settings-store';
import { useExportSource } from '@/hooks/use-export-source';
@@ -22,7 +34,10 @@ export function ExportHtmlDialog({ sourcePath }: { sourcePath: string }) {
const [error, setError] = useState<string | null>(null);
const handleSubmit = async () => {
if (!source) { setError('No file open.'); return; }
if (!source) {
setError('No file open.');
return;
}
setSubmitting(true);
setError(null);
try {
@@ -33,7 +48,10 @@ export function ExportHtmlDialog({ sourcePath }: { sourcePath: string }) {
highlightStyle: highlight,
renderTablesAsAscii: ascii,
});
const saveResult = await ipc.app.showSaveDialog?.({ title: 'Save as HTML', defaultPath: source.path.replace(/\.md$/, '.html') });
const saveResult = await ipc.app.showSaveDialog?.({
title: 'Save as HTML',
defaultPath: source.path.replace(/\.md$/, '.html'),
});
if (!saveResult?.ok || !saveResult.data) {
setSubmitting(false);
return;
@@ -64,13 +82,19 @@ export function ExportHtmlDialog({ sourcePath }: { sourcePath: string }) {
</DialogHeader>
<div className="space-y-3 text-sm">
<label className="flex items-center gap-2">
<Checkbox checked={standalone} onCheckedChange={(c) => setStandalone(!!c)} aria-label="Standalone" />
<Checkbox
checked={standalone}
onCheckedChange={(c) => setStandalone(!!c)}
aria-label="Standalone"
/>
Standalone document (with inline CSS)
</label>
<div>
<Label htmlFor="html-highlight">Syntax highlight style</Label>
<Select value={highlight} onValueChange={(v) => setHighlight(v as any)}>
<SelectTrigger id="html-highlight" aria-label="Highlight style"><SelectValue /></SelectTrigger>
<SelectTrigger id="html-highlight" aria-label="Highlight style">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="github">GitHub</SelectItem>
<SelectItem value="monokai">Monokai</SelectItem>
@@ -80,16 +104,28 @@ export function ExportHtmlDialog({ sourcePath }: { sourcePath: string }) {
</Select>
</div>
<label className="flex items-center gap-2">
<Checkbox checked={ascii} onCheckedChange={(c) => setAscii(!!c)} aria-label="ASCII tables" />
<Checkbox
checked={ascii}
onCheckedChange={(c) => setAscii(!!c)}
aria-label="ASCII tables"
/>
Render tables as ASCII
</label>
{error && (
<div role="alert" className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive">
<div
role="alert"
className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive"
>
{error}
</div>
)}
</div>
<ExportDialogFooter onCancel={closeModal} onSubmit={handleSubmit} submitting={submitting} submitLabel="Export" />
<ExportDialogFooter
onCancel={closeModal}
onSubmit={handleSubmit}
submitting={submitting}
submitLabel="Export"
/>
</DialogContent>
</Dialog>
);
src/renderer/components/modals/ExportPdfDialog.tsx
+48 -12
View File
@@ -1,8 +1,20 @@
import { useState } from 'react';
import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import {
Dialog,
DialogContent,
DialogDescription,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
import { Checkbox } from '@/components/ui/checkbox';
import { Label } from '@/components/ui/label';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from '@/components/ui/select';
import { useAppStore } from '@/stores/app-store';
import { useSettingsStore } from '@/stores/settings-store';
import { useExportSource } from '@/hooks/use-export-source';
@@ -19,7 +31,8 @@ const MARGIN_MAP = {
export function ExportPdfDialog({ sourcePath }: { sourcePath: string }) {
const closeModal = useAppStore((s) => s.closeModal);
const { fontSize, pdfFormat, pdfMargins, pdfEmbedFonts, renderTablesAsAscii } = useSettingsStore();
const { fontSize, pdfFormat, pdfMargins, pdfEmbedFonts, renderTablesAsAscii } =
useSettingsStore();
const [format, setFormat] = useState<'letter' | 'a4' | 'legal'>(pdfFormat);
const [margins, setMargins] = useState<'normal' | 'narrow' | 'wide'>(pdfMargins);
const [embed, setEmbed] = useState(pdfEmbedFonts);
@@ -45,9 +58,12 @@ export function ExportPdfDialog({ sourcePath }: { sourcePath: string }) {
highlightStyle: 'github',
renderTablesAsAscii: ascii,
});
const fmt = format === 'a4' ? { width: '210mm', height: '297mm' }
: format === 'legal' ? { width: '8.5in', height: '14in' }
: { width: '8.5in', height: '11in' };
const fmt =
format === 'a4'
? { width: '210mm', height: '297mm' }
: format === 'legal'
? { width: '8.5in', height: '14in' }
: { width: '8.5in', height: '11in' };
const m = MARGIN_MAP[margins];
const pageCss = `@page { size: ${fmt.width} ${fmt.height}; margin: ${m.top}mm ${m.right}mm ${m.bottom}mm ${m.left}mm; }`;
const finalHtml = html.replace('</style>', `${pageCss}</style>`);
@@ -80,7 +96,9 @@ export function ExportPdfDialog({ sourcePath }: { sourcePath: string }) {
<div>
<Label htmlFor="pdf-format">Format</Label>
<Select value={format} onValueChange={(v) => setFormat(v as typeof format)}>
<SelectTrigger id="pdf-format" aria-label="Format"><SelectValue /></SelectTrigger>
<SelectTrigger id="pdf-format" aria-label="Format">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="letter">Letter</SelectItem>
<SelectItem value="a4">A4</SelectItem>
@@ -91,7 +109,9 @@ export function ExportPdfDialog({ sourcePath }: { sourcePath: string }) {
<div>
<Label htmlFor="pdf-margins">Margins</Label>
<Select value={margins} onValueChange={(v) => setMargins(v as typeof margins)}>
<SelectTrigger id="pdf-margins" aria-label="Margins"><SelectValue /></SelectTrigger>
<SelectTrigger id="pdf-margins" aria-label="Margins">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="narrow">Narrow</SelectItem>
<SelectItem value="normal">Normal</SelectItem>
@@ -100,20 +120,36 @@ export function ExportPdfDialog({ sourcePath }: { sourcePath: string }) {
</Select>
</div>
<label className="flex items-center gap-2">
<Checkbox checked={embed} onCheckedChange={(c) => setEmbed(!!c)} aria-label="Embed fonts" />
<Checkbox
checked={embed}
onCheckedChange={(c) => setEmbed(!!c)}
aria-label="Embed fonts"
/>
Embed fonts
</label>
<label className="flex items-center gap-2">
<Checkbox checked={ascii} onCheckedChange={(c) => setAscii(!!c)} aria-label="ASCII tables" />
<Checkbox
checked={ascii}
onCheckedChange={(c) => setAscii(!!c)}
aria-label="ASCII tables"
/>
Render tables as ASCII
</label>
{error && (
<div role="alert" className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive">
<div
role="alert"
className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive"
>
{error}
</div>
)}
</div>
<ExportDialogFooter onCancel={closeModal} onSubmit={handleSubmit} submitting={submitting} submitLabel="Export" />
<ExportDialogFooter
onCancel={closeModal}
onSubmit={handleSubmit}
submitting={submitting}
submitLabel="Export"
/>
</DialogContent>
</Dialog>
);
src/renderer/components/modals/ExportSettings.tsx
+42 -9
View File
@@ -1,17 +1,33 @@
import { useSettingsStore } from '@/stores/settings-store';
import { Label } from '@/components/ui/label';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from '@/components/ui/select';
import { Switch } from '@/components/ui/switch';
export function ExportSettings() {
const { pdfFormat, pdfMargins, pdfEmbedFonts, docxTemplate, htmlHighlightStyle, renderTablesAsAscii, setSetting } = useSettingsStore();
const {
pdfFormat,
pdfMargins,
pdfEmbedFonts,
docxTemplate,
htmlHighlightStyle,
renderTablesAsAscii,
setSetting,
} = useSettingsStore();
return (
<div className="space-y-5 text-sm">
<div>
<Label htmlFor="export-pdf-format">Default PDF format</Label>
<Select value={pdfFormat} onValueChange={(v) => setSetting('pdfFormat', v as any)}>
<SelectTrigger id="export-pdf-format" aria-label="Default PDF format"><SelectValue /></SelectTrigger>
<SelectTrigger id="export-pdf-format" aria-label="Default PDF format">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="letter">Letter</SelectItem>
<SelectItem value="a4">A4</SelectItem>
@@ -22,7 +38,9 @@ export function ExportSettings() {
<div>
<Label htmlFor="export-pdf-margins">Default PDF margins</Label>
<Select value={pdfMargins} onValueChange={(v) => setSetting('pdfMargins', v as any)}>
<SelectTrigger id="export-pdf-margins" aria-label="Default PDF margins"><SelectValue /></SelectTrigger>
<SelectTrigger id="export-pdf-margins" aria-label="Default PDF margins">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="narrow">Narrow</SelectItem>
<SelectItem value="normal">Normal</SelectItem>
@@ -32,12 +50,18 @@ export function ExportSettings() {
</div>
<label className="flex items-center justify-between">
<span>Embed fonts in PDFs</span>
<Switch checked={pdfEmbedFonts} onCheckedChange={(c) => setSetting('pdfEmbedFonts', c)} aria-label="Embed fonts" />
<Switch
checked={pdfEmbedFonts}
onCheckedChange={(c) => setSetting('pdfEmbedFonts', c)}
aria-label="Embed fonts"
/>
</label>
<div>
<Label htmlFor="export-docx-template">Default DOCX template</Label>
<Select value={docxTemplate} onValueChange={(v) => setSetting('docxTemplate', v as any)}>
<SelectTrigger id="export-docx-template" aria-label="Default DOCX template"><SelectValue /></SelectTrigger>
<SelectTrigger id="export-docx-template" aria-label="Default DOCX template">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="standard">Standard</SelectItem>
<SelectItem value="minimal">Minimal</SelectItem>
@@ -47,8 +71,13 @@ export function ExportSettings() {
</div>
<div>
<Label htmlFor="export-html-highlight">Default HTML highlight</Label>
<Select value={htmlHighlightStyle} onValueChange={(v) => setSetting('htmlHighlightStyle', v as any)}>
<SelectTrigger id="export-html-highlight" aria-label="Default HTML highlight"><SelectValue /></SelectTrigger>
<Select
value={htmlHighlightStyle}
onValueChange={(v) => setSetting('htmlHighlightStyle', v as any)}
>
<SelectTrigger id="export-html-highlight" aria-label="Default HTML highlight">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="github">GitHub</SelectItem>
<SelectItem value="monokai">Monokai</SelectItem>
@@ -59,7 +88,11 @@ export function ExportSettings() {
</div>
<label className="flex items-center justify-between">
<span>Render tables as ASCII by default</span>
<Switch checked={renderTablesAsAscii} onCheckedChange={(c) => setSetting('renderTablesAsAscii', c)} aria-label="ASCII tables by default" />
<Switch
checked={renderTablesAsAscii}
onCheckedChange={(c) => setSetting('renderTablesAsAscii', c)}
aria-label="ASCII tables by default"
/>
</label>
</div>
);
src/renderer/components/modals/FindInFilesDialog.tsx
+31 -7
View File
@@ -1,5 +1,12 @@
import { useState } from 'react';
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
import { Button } from '@/components/ui/button';
import { Checkbox } from '@/components/ui/checkbox';
import { Input } from '@/components/ui/input';
@@ -67,22 +74,35 @@ export function FindInFilesDialog() {
</div>
<div className="flex gap-4">
<label className="flex items-center gap-2">
<Checkbox checked={isRegex} onCheckedChange={(c) => setIsRegex(!!c)} aria-label="Regex" />
<Checkbox
checked={isRegex}
onCheckedChange={(c) => setIsRegex(!!c)}
aria-label="Regex"
/>
Regex
</label>
<label className="flex items-center gap-2">
<Checkbox checked={caseSensitive} onCheckedChange={(c) => setCaseSensitive(!!c)} aria-label="Case sensitive" />
<Checkbox
checked={caseSensitive}
onCheckedChange={(c) => setCaseSensitive(!!c)}
aria-label="Case sensitive"
/>
Case sensitive
</label>
</div>
{error && (
<div role="alert" className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive">
<div
role="alert"
className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive"
>
{error}
</div>
)}
{results.length > 0 && (
<div>
<Label>{results.length} result{results.length === 1 ? '' : 's'}</Label>
<Label>
{results.length} result{results.length === 1 ? '' : 's'}
</Label>
<div className="max-h-64 overflow-auto rounded border border-border bg-card/20 text-xs">
{results.map((r, i) => (
<button
@@ -91,7 +111,9 @@ export function FindInFilesDialog() {
className="block w-full truncate border-b border-border/30 px-2 py-1 text-left hover:bg-card/50"
data-testid="find-result"
>
<span className="font-mono text-muted-foreground">{r.filePath}:{r.line}</span>
<span className="font-mono text-muted-foreground">
{r.filePath}:{r.line}
</span>
<span className="ml-2">{r.content}</span>
</button>
))}
@@ -100,7 +122,9 @@ export function FindInFilesDialog() {
)}
</div>
<DialogFooter>
<Button variant="ghost" onClick={closeModal} disabled={submitting}>Close</Button>
<Button variant="ghost" onClick={closeModal} disabled={submitting}>
Close
</Button>
<Button onClick={handleSearch} disabled={submitting || !query}>
{submitting ? 'Searching…' : 'Search'}
</Button>
src/renderer/components/modals/SettingsSheet.tsx
+28 -8
View File
@@ -1,4 +1,10 @@
import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle } from '@/components/ui/sheet';
import {
Sheet,
SheetContent,
SheetDescription,
SheetHeader,
SheetTitle,
} from '@/components/ui/sheet';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import { Button } from '@/components/ui/button';
import { useAppStore } from '@/stores/app-store';
@@ -31,16 +37,30 @@ export function SettingsSheet() {
<TabsTrigger value="about">About</TabsTrigger>
</TabsList>
<div className="mt-4 max-h-[70vh] overflow-y-auto pr-2">
<TabsContent value="editor"><EditorSettings /></TabsContent>
<TabsContent value="theme"><ThemeSettings /></TabsContent>
<TabsContent value="export"><ExportSettings /></TabsContent>
<TabsContent value="plugins"><PluginsSettings /></TabsContent>
<TabsContent value="updates"><UpdatesSettings /></TabsContent>
<TabsContent value="about"><AboutSettings /></TabsContent>
<TabsContent value="editor">
<EditorSettings />
</TabsContent>
<TabsContent value="theme">
<ThemeSettings />
</TabsContent>
<TabsContent value="export">
<ExportSettings />
</TabsContent>
<TabsContent value="plugins">
<PluginsSettings />
</TabsContent>
<TabsContent value="updates">
<UpdatesSettings />
</TabsContent>
<TabsContent value="about">
<AboutSettings />
</TabsContent>
</div>
</Tabs>
<div className="mt-4 flex justify-end border-t border-border pt-4">
<Button variant="ghost" onClick={resetToDefaults}>Reset to defaults</Button>
<Button variant="ghost" onClick={resetToDefaults}>
Reset to defaults
</Button>
</div>
</SheetContent>
</Sheet>
src/renderer/components/modals/TableGeneratorDialog.tsx
+53 -10
View File
@@ -1,5 +1,12 @@
import { useState } from 'react';
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
import { Button } from '@/components/ui/button';
import { Checkbox } from '@/components/ui/checkbox';
import { Input } from '@/components/ui/input';
@@ -11,7 +18,13 @@ function pad(s: string, w: number) {
return s.padEnd(w);
}
function generateTable(rows: number, cols: number, hasHeader: boolean, headers: string[], data: string[][]): string {
function generateTable(
rows: number,
cols: number,
hasHeader: boolean,
headers: string[],
data: string[][]
): string {
const width = cols;
const colWidths: number[] = Array.from({ length: width }, (_, c) => {
const all = [headers[c] ?? '', ...data.map((r) => r[c] ?? '')];
@@ -19,11 +32,21 @@ function generateTable(rows: number, cols: number, hasHeader: boolean, headers:
});
const lines: string[] = [];
if (hasHeader) {
lines.push('| ' + Array.from({ length: width }, (_, c) => pad(headers[c] ?? `Col ${c + 1}`, colWidths[c])).join(' | ') + ' |');
lines.push(
'| ' +
Array.from({ length: width }, (_, c) =>
pad(headers[c] ?? `Col ${c + 1}`, colWidths[c])
).join(' | ') +
' |'
);
lines.push('| ' + colWidths.map((w) => '-'.repeat(w)).join(' | ') + ' |');
}
for (const row of data) {
lines.push('| ' + Array.from({ length: width }, (_, c) => pad(row[c] ?? '', colWidths[c])).join(' | ') + ' |');
lines.push(
'| ' +
Array.from({ length: width }, (_, c) => pad(row[c] ?? '', colWidths[c])).join(' | ') +
' |'
);
}
// Add empty rows if data has fewer
for (let i = data.length; i < rows; i++) {
@@ -53,7 +76,13 @@ export function TableGeneratorDialog() {
const updateHeadersCount = (newCols: number) => {
setCols(newCols);
setHeaders((prev) => {
if (prev.length < newCols) return [...prev, ...Array(newCols - prev.length).fill('').map((_, i) => `Col ${prev.length + i + 1}`)];
if (prev.length < newCols)
return [
...prev,
...Array(newCols - prev.length)
.fill('')
.map((_, i) => `Col ${prev.length + i + 1}`),
];
return prev.slice(0, newCols);
});
};
@@ -88,18 +117,27 @@ export function TableGeneratorDialog() {
min={1}
max={20}
value={cols}
onChange={(e) => updateHeadersCount(Math.max(1, Math.min(20, Number(e.target.value) || 1)))}
onChange={(e) =>
updateHeadersCount(Math.max(1, Math.min(20, Number(e.target.value) || 1)))
}
/>
</div>
</div>
<label className="flex items-center gap-2">
<Checkbox checked={hasHeader} onCheckedChange={(c) => setHasHeader(!!c)} aria-label="Header" />
<Checkbox
checked={hasHeader}
onCheckedChange={(c) => setHasHeader(!!c)}
aria-label="Header"
/>
Include header row
</label>
{hasHeader && (
<div>
<Label>Header names</Label>
<div className="grid gap-2" style={{ gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))` }}>
<div
className="grid gap-2"
style={{ gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))` }}
>
{Array.from({ length: cols }, (_, i) => (
<Input
key={i}
@@ -117,13 +155,18 @@ export function TableGeneratorDialog() {
)}
<div>
<Label>Output</Label>
<pre className="overflow-auto rounded border border-border bg-card/30 p-3 text-xs" data-testid="table-output">
<pre
className="overflow-auto rounded border border-border bg-card/30 p-3 text-xs"
data-testid="table-output"
>
{output}
</pre>
</div>
</div>
<DialogFooter>
<Button variant="ghost" onClick={closeModal}>Close</Button>
<Button variant="ghost" onClick={closeModal}>
Close
</Button>
<Button onClick={handleCopy}>Copy</Button>
</DialogFooter>
</DialogContent>
src/renderer/components/modals/ThemeSettings.tsx
+29 -7
View File
@@ -1,7 +1,13 @@
import { useSettingsStore } from '@/stores/settings-store';
import { Label } from '@/components/ui/label';
import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from '@/components/ui/select';
export function ThemeSettings() {
const { theme, accentColor, fontFamily, setSetting } = useSettingsStore();
@@ -10,16 +16,30 @@ export function ThemeSettings() {
<div className="space-y-5 text-sm">
<div>
<Label>Mode</Label>
<RadioGroup value={theme} onValueChange={(v) => setSetting('theme', v as 'light' | 'dark' | 'system')}>
<div className="flex items-center gap-2"><RadioGroupItem value="light" id="theme-light" /><Label htmlFor="theme-light">Light</Label></div>
<div className="flex items-center gap-2"><RadioGroupItem value="dark" id="theme-dark" /><Label htmlFor="theme-dark">Dark</Label></div>
<div className="flex items-center gap-2"><RadioGroupItem value="system" id="theme-system" /><Label htmlFor="theme-system">System</Label></div>
<RadioGroup
value={theme}
onValueChange={(v) => setSetting('theme', v as 'light' | 'dark' | 'system')}
>
<div className="flex items-center gap-2">
<RadioGroupItem value="light" id="theme-light" />
<Label htmlFor="theme-light">Light</Label>
</div>
<div className="flex items-center gap-2">
<RadioGroupItem value="dark" id="theme-dark" />
<Label htmlFor="theme-dark">Dark</Label>
</div>
<div className="flex items-center gap-2">
<RadioGroupItem value="system" id="theme-system" />
<Label htmlFor="theme-system">System</Label>
</div>
</RadioGroup>
</div>
<div>
<Label htmlFor="theme-accent">Accent color</Label>
<Select value={accentColor} onValueChange={(v) => setSetting('accentColor', v as any)}>
<SelectTrigger id="theme-accent" aria-label="Accent color"><SelectValue /></SelectTrigger>
<SelectTrigger id="theme-accent" aria-label="Accent color">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="brand">Brand (orange)</SelectItem>
<SelectItem value="blue">Blue</SelectItem>
@@ -32,7 +52,9 @@ export function ThemeSettings() {
<div>
<Label htmlFor="theme-font-family">Editor font</Label>
<Select value={fontFamily} onValueChange={(v) => setSetting('fontFamily', v as any)}>
<SelectTrigger id="theme-font-family" aria-label="Editor font"><SelectValue /></SelectTrigger>
<SelectTrigger id="theme-font-family" aria-label="Editor font">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="system">System (Plus Jakarta Sans)</SelectItem>
<SelectItem value="jetbrains">JetBrains Mono</SelectItem>
src/renderer/components/modals/WelcomeDialog.tsx
+22 -5
View File
@@ -1,5 +1,12 @@
import { useState } from 'react';
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
import { Button } from '@/components/ui/button';
import { Checkbox } from '@/components/ui/checkbox';
import { useAppStore } from '@/stores/app-store';
@@ -27,20 +34,30 @@ export function WelcomeDialog() {
<div className="space-y-3 text-sm">
<div className="rounded-md border border-border bg-card/30 p-3">
<h3 className="font-semibold">1. Open a folder</h3>
<p className="text-muted-foreground">File → Open Folder, or ⌘O. Your tree appears on the left.</p>
<p className="text-muted-foreground">
File → Open Folder, or ⌘O. Your tree appears on the left.
</p>
</div>
<div className="rounded-md border border-border bg-card/30 p-3">
<h3 className="font-semibold">2. Edit & preview</h3>
<p className="text-muted-foreground">Type on the left, see the rendered preview on the right. Toggle with ⌘\.</p>
<p className="text-muted-foreground">
Type on the left, see the rendered preview on the right. Toggle with ⌘\.
</p>
</div>
<div className="rounded-md border border-border bg-card/30 p-3">
<h3 className="font-semibold">3. Export anywhere</h3>
<p className="text-muted-foreground">File → Export to PDF / DOCX / HTML, or batch convert a folder.</p>
<p className="text-muted-foreground">
File → Export to PDF / DOCX / HTML, or batch convert a folder.
</p>
</div>
</div>
<DialogFooter className="flex-row items-center justify-between sm:justify-between">
<label className="flex items-center gap-2 text-xs text-muted-foreground">
<Checkbox checked={dontShow} onCheckedChange={(c) => setDontShow(!!c)} aria-label="Don't show again" />
<Checkbox
checked={dontShow}
onCheckedChange={(c) => setDontShow(!!c)}
aria-label="Don't show again"
/>
Don't show again
</label>
<Button onClick={handleClose}>Get started</Button>
src/renderer/components/modals/WordExportDialog.tsx
+36 -9
View File
@@ -1,5 +1,12 @@
import { useState, useEffect } from 'react';
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
import { Button } from '@/components/ui/button';
import { Label } from '@/components/ui/label';
import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
@@ -16,7 +23,9 @@ export function WordExportDialog({ sourcePath }: { sourcePath: string }) {
const docxCustomTemplatePath = useSettingsStore((s) => s.docxCustomTemplatePath);
const source = useExportSource();
const [templateMode, setTemplateMode] = useState<'standard' | 'custom'>(docxCustomTemplatePath ? 'custom' : 'standard');
const [templateMode, setTemplateMode] = useState<'standard' | 'custom'>(
docxCustomTemplatePath ? 'custom' : 'standard'
);
const [submitting, setSubmitting] = useState(false);
const [error, setError] = useState<string | null>(null);
@@ -32,7 +41,10 @@ export function WordExportDialog({ sourcePath }: { sourcePath: string }) {
};
const handleSubmit = async () => {
if (!source) { setError('No file open.'); return; }
if (!source) {
setError('No file open.');
return;
}
setSubmitting(true);
setError(null);
try {
@@ -41,7 +53,10 @@ export function WordExportDialog({ sourcePath }: { sourcePath: string }) {
title: source.title,
customTemplatePath: templateMode === 'custom' ? docxCustomTemplatePath : null,
});
const saveResult = await ipc.app.showSaveDialog?.({ title: 'Save as Word document', defaultPath: source.path.replace(/\.md$/, '.docx') });
const saveResult = await ipc.app.showSaveDialog?.({
title: 'Save as Word document',
defaultPath: source.path.replace(/\.md$/, '.docx'),
});
if (!saveResult?.ok || !saveResult.data) {
setSubmitting(false);
return;
@@ -73,7 +88,10 @@ export function WordExportDialog({ sourcePath }: { sourcePath: string }) {
<div className="space-y-3 text-sm">
<div>
<Label>Template</Label>
<RadioGroup value={templateMode} onValueChange={(v) => setTemplateMode(v as 'standard' | 'custom')}>
<RadioGroup
value={templateMode}
onValueChange={(v) => setTemplateMode(v as 'standard' | 'custom')}
>
<div className="flex items-center gap-2">
<RadioGroupItem value="standard" id="template-standard" />
<Label htmlFor="template-standard">Standard (bundled)</Label>
@@ -87,9 +105,13 @@ export function WordExportDialog({ sourcePath }: { sourcePath: string }) {
{templateMode === 'custom' && (
<div className="rounded border border-border bg-card/20 p-2 text-xs">
{docxCustomTemplatePath ? (
<span>Template path: <code>{docxCustomTemplatePath}</code></span>
<span>
Template path: <code>{docxCustomTemplatePath}</code>
</span>
) : (
<span className="text-muted-foreground">No template selected. Click "Choose template..." to pick a .dotx file.</span>
<span className="text-muted-foreground">
No template selected. Click "Choose template..." to pick a .dotx file.
</span>
)}
<Button variant="ghost" size="sm" onClick={handleChooseTemplate} className="ml-2">
Choose template...
@@ -97,13 +119,18 @@ export function WordExportDialog({ sourcePath }: { sourcePath: string }) {
</div>
)}
{error && (
<div role="alert" className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive">
<div
role="alert"
className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive"
>
{error}
</div>
)}
</div>
<DialogFooter>
<Button variant="ghost" onClick={closeModal} disabled={submitting}>Cancel</Button>
<Button variant="ghost" onClick={closeModal} disabled={submitting}>
Cancel
</Button>
<Button onClick={handleSubmit} disabled={submitting}>
{submitting ? 'Exporting…' : 'Export'}
</Button>
src/renderer/components/modals/WritingAnalyticsDialog.tsx
+22 -9
View File
@@ -1,5 +1,11 @@
import { useState, useEffect } from 'react';
import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import {
Dialog,
DialogContent,
DialogDescription,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { useAppStore } from '@/stores/app-store';
@@ -32,7 +38,8 @@ export function WritingAnalyticsDialog() {
}, [isGoalReached, celebrated]);
// Find max count for word cloud scaling
const maxWordCount = metrics.topWords.length > 0 ? Math.max(...metrics.topWords.map((w) => w.count)) : 1;
const maxWordCount =
metrics.topWords.length > 0 ? Math.max(...metrics.topWords.map((w) => w.count)) : 1;
// Helper to determine color coding for Flesch Readability Ease
const getReadabilityColor = (score: number) => {
@@ -50,7 +57,8 @@ export function WritingAnalyticsDialog() {
<DialogTitle className="text-xl font-bold font-display">Writing Analytics</DialogTitle>
</div>
<DialogDescription>
Real-time readability metrics, vocabulary analysis, and progress towards your daily word goal.
Real-time readability metrics, vocabulary analysis, and progress towards your daily word
goal.
</DialogDescription>
</DialogHeader>
@@ -75,9 +83,7 @@ export function WritingAnalyticsDialog() {
</div>
<div className="space-y-1">
<p className="text-xs text-muted-foreground">Grade Level</p>
<p className="text-2xl font-bold text-foreground">
{metrics.fleschGrade}
</p>
<p className="text-2xl font-bold text-foreground">{metrics.fleschGrade}</p>
<p className="text-xs text-muted-foreground">US school grade</p>
</div>
</div>
@@ -225,12 +231,19 @@ export function WritingAnalyticsDialog() {
</div>
<div className="text-xs text-muted-foreground mb-4">
Unique words: <span className="font-semibold text-foreground">{metrics.uniqueWordCount}</span> /{' '}
{metrics.wordCount} ({metrics.wordCount > 0 ? Math.round((metrics.uniqueWordCount / metrics.wordCount) * 100) : 0}%)
Unique words:{' '}
<span className="font-semibold text-foreground">{metrics.uniqueWordCount}</span> /{' '}
{metrics.wordCount} (
{metrics.wordCount > 0
? Math.round((metrics.uniqueWordCount / metrics.wordCount) * 100)
: 0}
%)
</div>
<div className="mt-4">
<p className="text-xs font-semibold text-muted-foreground mb-2">Word Frequency Cloud</p>
<p className="text-xs font-semibold text-muted-foreground mb-2">
Word Frequency Cloud
</p>
{metrics.topWords.length === 0 ? (
<div className="flex h-32 items-center justify-center rounded-lg border border-dashed border-border bg-card/10 text-xs text-muted-foreground">
Add more words to see vocabulary statistics
src/renderer/components/preview/MermaidLazy.tsx
+6 -1
View File
@@ -39,7 +39,12 @@ export function MermaidLazy({ code }: Props) {
};
}, [code]);
if (error) return <div className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive">{error}</div>;
if (error)
return (
<div className="rounded border border-destructive/40 bg-destructive/5 p-2 text-xs text-destructive">
{error}
</div>
);
if (!svg) return <div className="text-xs text-muted-foreground">Loading diagram…</div>;
return <div data-testid="mermaid-output" dangerouslySetInnerHTML={{ __html: svg }} />;
}
src/renderer/components/sidebar/FileTree.tsx
+7 -1
View File
@@ -2,7 +2,13 @@ import { ChevronRight, Folder, FolderOpen, File, FileText } from 'lucide-react';
import { useFileStore } from '@/stores/file-store';
import { cn } from '@/lib/utils';
function FileTreeNode({ node, depth }: { node: import('@/stores/file-store').FileNode; depth: number }) {
function FileTreeNode({
node,
depth,
}: {
node: import('@/stores/file-store').FileNode;
depth: number;
}) {
const { expanded, activeTabId, loadChildren, toggleExpanded, openFile } = useFileStore();
const isExpanded = expanded.has(node.path);
const isActive = activeTabId === node.path;
src/renderer/components/sidebar/GitStatusPanel.tsx
+6 -2
View File
@@ -65,7 +65,9 @@ export function GitStatusPanel() {
<div className="p-3 text-xs">
<div className="text-destructive">Error: {error}</div>
<p className="mt-1 text-muted-foreground">Not a git repository, or git not installed.</p>
<Button size="sm" variant="ghost" onClick={load} className="mt-2">Retry</Button>
<Button size="sm" variant="ghost" onClick={load} className="mt-2">
Retry
</Button>
</div>
);
}
@@ -77,7 +79,9 @@ export function GitStatusPanel() {
return (
<div className="p-2 text-xs">
<div className="flex items-center justify-between px-1 py-1">
<span className="font-semibold">{status.length} changed file{status.length === 1 ? '' : 's'}</span>
<span className="font-semibold">
{status.length} changed file{status.length === 1 ? '' : 's'}
</span>
<Button size="sm" variant="ghost" onClick={load} aria-label="Refresh">
<RefreshCw className="h-3 w-3" />
</Button>
src/renderer/components/sidebar/Sidebar.tsx
+20 -6
View File
@@ -35,7 +35,11 @@ export function Sidebar() {
{!tree ? (
<div className="flex flex-col items-center gap-2 p-4 text-xs text-muted-foreground">
<span>No folder opened</span>
<Button size="sm" variant="outline" onClick={() => useFileStore.getState().openFolderDialog()}>
<Button
size="sm"
variant="outline"
onClick={() => useFileStore.getState().openFolderDialog()}
>
<FolderOpen className="mr-1" /> Open Folder
</Button>
</div>
@@ -114,11 +118,21 @@ export function Sidebar() {
matching section into view. The hidden elements expose a hook for
Playwright tests and the menu handler. */}
<div className="sr-only" aria-hidden="true">
<button data-testid="sidebar-jump-explorer" onClick={() => scrollToSection('Files')}>jump-explorer</button>
<button data-testid="sidebar-jump-outline" onClick={() => scrollToSection('Outline')}>jump-outline</button>
<button data-testid="sidebar-jump-snippets" onClick={() => scrollToSection('Snippets')}>jump-snippets</button>
<button data-testid="sidebar-jump-templates" onClick={() => scrollToSection('Templates')}>jump-templates</button>
<button data-testid="sidebar-jump-git" onClick={() => scrollToSection('Git')}>jump-git</button>
<button data-testid="sidebar-jump-explorer" onClick={() => scrollToSection('Files')}>
jump-explorer
</button>
<button data-testid="sidebar-jump-outline" onClick={() => scrollToSection('Outline')}>
jump-outline
</button>
<button data-testid="sidebar-jump-snippets" onClick={() => scrollToSection('Snippets')}>
jump-snippets
</button>
<button data-testid="sidebar-jump-templates" onClick={() => scrollToSection('Templates')}>
jump-templates
</button>
<button data-testid="sidebar-jump-git" onClick={() => scrollToSection('Git')}>
jump-git
</button>
</div>
</ScrollArea>
);
src/renderer/components/sidebar/Templates.tsx
+8 -2
View File
@@ -5,7 +5,11 @@ import { insertSnippet } from '@/lib/editor-commands';
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: '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' },
@@ -50,7 +54,9 @@ export function Templates() {
<span className="font-semibold text-foreground truncate">{t.name}</span>
<Download className="h-3 w-3 opacity-0 group-hover:opacity-100 text-muted-foreground/80 hover:text-brand transition-opacity" />
</div>
<p className="text-[10px] text-muted-foreground line-clamp-1 mt-0.5">{t.description}</p>
<p className="text-[10px] text-muted-foreground line-clamp-1 mt-0.5">
{t.description}
</p>
</div>
</div>
))}
src/renderer/components/ui/button.tsx
+26 -34
View File
@@ -1,57 +1,49 @@
import * as React from "react"
import { Slot } from "@radix-ui/react-slot"
import { cva, type VariantProps } from "class-variance-authority"
import * as React from 'react';
import { Slot } from '@radix-ui/react-slot';
import { cva, type VariantProps } from 'class-variance-authority';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
const buttonVariants = cva(
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
{
variants: {
variant: {
default:
"bg-primary text-primary-foreground shadow hover:bg-primary/90",
destructive:
"bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
default: 'bg-primary text-primary-foreground shadow hover:bg-primary/90',
destructive: 'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90',
outline:
"border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
secondary:
"bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
ghost: "hover:bg-accent hover:text-accent-foreground",
link: "text-primary underline-offset-4 hover:underline",
'border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground',
secondary: 'bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80',
ghost: 'hover:bg-accent hover:text-accent-foreground',
link: 'text-primary underline-offset-4 hover:underline',
},
size: {
default: "h-9 px-4 py-2",
sm: "h-8 rounded-md px-3 text-xs",
lg: "h-10 rounded-md px-8",
icon: "h-9 w-9",
default: 'h-9 px-4 py-2',
sm: 'h-8 rounded-md px-3 text-xs',
lg: 'h-10 rounded-md px-8',
icon: 'h-9 w-9',
},
},
defaultVariants: {
variant: "default",
size: "default",
variant: 'default',
size: 'default',
},
}
)
);
export interface ButtonProps
extends React.ButtonHTMLAttributes<HTMLButtonElement>,
VariantProps<typeof buttonVariants> {
asChild?: boolean
extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
asChild?: boolean;
}
const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
({ className, variant, size, asChild = false, ...props }, ref) => {
const Comp = asChild ? Slot : "button"
const Comp = asChild ? Slot : 'button';
return (
<Comp
className={cn(buttonVariants({ variant, size, className }))}
ref={ref}
{...props}
/>
)
<Comp className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />
);
}
)
Button.displayName = "Button"
);
Button.displayName = 'Button';
export { Button, buttonVariants }
export { Button, buttonVariants };
src/renderer/components/ui/checkbox.tsx
+9 -11
View File
@@ -1,7 +1,7 @@
import * as React from "react"
import * as CheckboxPrimitive from "@radix-ui/react-checkbox"
import { Check } from "lucide-react"
import { cn } from "@/lib/utils"
import * as React from 'react';
import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
import { Check } from 'lucide-react';
import { cn } from '@/lib/utils';
const Checkbox = React.forwardRef<
React.ElementRef<typeof CheckboxPrimitive.Root>,
@@ -10,18 +10,16 @@ const Checkbox = React.forwardRef<
<CheckboxPrimitive.Root
ref={ref}
className={cn(
"peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
'peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground',
className
)}
{...props}
>
<CheckboxPrimitive.Indicator
className={cn("flex items-center justify-center text-current")}
>
<CheckboxPrimitive.Indicator className={cn('flex items-center justify-center text-current')}>
<Check className="h-4 w-4" />
</CheckboxPrimitive.Indicator>
</CheckboxPrimitive.Root>
))
Checkbox.displayName = CheckboxPrimitive.Root.displayName
));
Checkbox.displayName = CheckboxPrimitive.Root.displayName;
export { Checkbox }
export { Checkbox };
src/renderer/components/ui/collapsible.tsx
+6 -6
View File
@@ -1,11 +1,11 @@
"use client"
'use client';
import * as CollapsiblePrimitive from "@radix-ui/react-collapsible"
import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
const Collapsible = CollapsiblePrimitive.Root
const Collapsible = CollapsiblePrimitive.Root;
const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger
const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger;
const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent
const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent;
export { Collapsible, CollapsibleTrigger, CollapsibleContent }
export { Collapsible, CollapsibleTrigger, CollapsibleContent };
src/renderer/components/ui/context-menu.tsx
+46 -57
View File
@@ -1,34 +1,34 @@
"use client"
'use client';
import * as React from "react"
import * as ContextMenuPrimitive from "@radix-ui/react-context-menu"
import { Check, ChevronRight, Circle } from "lucide-react"
import * as React from 'react';
import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
import { Check, ChevronRight, Circle } from 'lucide-react';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
const ContextMenu = ContextMenuPrimitive.Root
const ContextMenu = ContextMenuPrimitive.Root;
const ContextMenuTrigger = ContextMenuPrimitive.Trigger
const ContextMenuTrigger = ContextMenuPrimitive.Trigger;
const ContextMenuGroup = ContextMenuPrimitive.Group
const ContextMenuGroup = ContextMenuPrimitive.Group;
const ContextMenuPortal = ContextMenuPrimitive.Portal
const ContextMenuPortal = ContextMenuPrimitive.Portal;
const ContextMenuSub = ContextMenuPrimitive.Sub
const ContextMenuSub = ContextMenuPrimitive.Sub;
const ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup
const ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
const ContextMenuSubTrigger = React.forwardRef<
React.ElementRef<typeof ContextMenuPrimitive.SubTrigger>,
React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.SubTrigger> & {
inset?: boolean
inset?: boolean;
}
>(({ className, inset, children, ...props }, ref) => (
<ContextMenuPrimitive.SubTrigger
ref={ref}
className={cn(
"flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground",
inset && "pl-8",
'flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground',
inset && 'pl-8',
className
)}
{...props}
@@ -36,8 +36,8 @@ const ContextMenuSubTrigger = React.forwardRef<
{children}
<ChevronRight className="ml-auto h-4 w-4" />
</ContextMenuPrimitive.SubTrigger>
))
ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName
));
ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;
const ContextMenuSubContent = React.forwardRef<
React.ElementRef<typeof ContextMenuPrimitive.SubContent>,
@@ -46,13 +46,13 @@ const ContextMenuSubContent = React.forwardRef<
<ContextMenuPrimitive.SubContent
ref={ref}
className={cn(
"z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-context-menu-content-transform-origin]",
'z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-context-menu-content-transform-origin]',
className
)}
{...props}
/>
))
ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName
));
ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
const ContextMenuContent = React.forwardRef<
React.ElementRef<typeof ContextMenuPrimitive.Content>,
@@ -62,32 +62,32 @@ const ContextMenuContent = React.forwardRef<
<ContextMenuPrimitive.Content
ref={ref}
className={cn(
"z-50 max-h-[--radix-context-menu-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-context-menu-content-transform-origin]",
'z-50 max-h-[--radix-context-menu-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-context-menu-content-transform-origin]',
className
)}
{...props}
/>
</ContextMenuPrimitive.Portal>
))
ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName
));
ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;
const ContextMenuItem = React.forwardRef<
React.ElementRef<typeof ContextMenuPrimitive.Item>,
React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Item> & {
inset?: boolean
inset?: boolean;
}
>(({ className, inset, ...props }, ref) => (
<ContextMenuPrimitive.Item
ref={ref}
className={cn(
"relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
inset && "pl-8",
'relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
inset && 'pl-8',
className
)}
{...props}
/>
))
ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName
));
ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;
const ContextMenuCheckboxItem = React.forwardRef<
React.ElementRef<typeof ContextMenuPrimitive.CheckboxItem>,
@@ -96,7 +96,7 @@ const ContextMenuCheckboxItem = React.forwardRef<
<ContextMenuPrimitive.CheckboxItem
ref={ref}
className={cn(
"relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
className
)}
checked={checked}
@@ -109,9 +109,8 @@ const ContextMenuCheckboxItem = React.forwardRef<
</span>
{children}
</ContextMenuPrimitive.CheckboxItem>
))
ContextMenuCheckboxItem.displayName =
ContextMenuPrimitive.CheckboxItem.displayName
));
ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;
const ContextMenuRadioItem = React.forwardRef<
React.ElementRef<typeof ContextMenuPrimitive.RadioItem>,
@@ -120,7 +119,7 @@ const ContextMenuRadioItem = React.forwardRef<
<ContextMenuPrimitive.RadioItem
ref={ref}
className={cn(
"relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
className
)}
{...props}
@@ -132,26 +131,22 @@ const ContextMenuRadioItem = React.forwardRef<
</span>
{children}
</ContextMenuPrimitive.RadioItem>
))
ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName
));
ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName;
const ContextMenuLabel = React.forwardRef<
React.ElementRef<typeof ContextMenuPrimitive.Label>,
React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Label> & {
inset?: boolean
inset?: boolean;
}
>(({ className, inset, ...props }, ref) => (
<ContextMenuPrimitive.Label
ref={ref}
className={cn(
"px-2 py-1.5 text-sm font-semibold text-foreground",
inset && "pl-8",
className
)}
className={cn('px-2 py-1.5 text-sm font-semibold text-foreground', inset && 'pl-8', className)}
{...props}
/>
))
ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName
));
ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName;
const ContextMenuSeparator = React.forwardRef<
React.ElementRef<typeof ContextMenuPrimitive.Separator>,
@@ -159,27 +154,21 @@ const ContextMenuSeparator = React.forwardRef<
>(({ className, ...props }, ref) => (
<ContextMenuPrimitive.Separator
ref={ref}
className={cn("-mx-1 my-1 h-px bg-border", className)}
className={cn('-mx-1 my-1 h-px bg-border', className)}
{...props}
/>
))
ContextMenuSeparator.displayName = ContextMenuPrimitive.Separator.displayName
));
ContextMenuSeparator.displayName = ContextMenuPrimitive.Separator.displayName;
const ContextMenuShortcut = ({
className,
...props
}: React.HTMLAttributes<HTMLSpanElement>) => {
const ContextMenuShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {
return (
<span
className={cn(
"ml-auto text-xs tracking-widest text-muted-foreground",
className
)}
className={cn('ml-auto text-xs tracking-widest text-muted-foreground', className)}
{...props}
/>
)
}
ContextMenuShortcut.displayName = "ContextMenuShortcut"
);
};
ContextMenuShortcut.displayName = 'ContextMenuShortcut';
export {
ContextMenu,
@@ -197,4 +186,4 @@ export {
ContextMenuSubContent,
ContextMenuSubTrigger,
ContextMenuRadioGroup,
}
};
src/renderer/components/ui/dialog.tsx
+32 -46
View File
@@ -1,34 +1,26 @@
"use client"
'use client';
import * as React from "react"
import { XIcon } from "lucide-react"
import * as DialogPrimitive from "@radix-ui/react-dialog"
import * as React from 'react';
import { XIcon } from 'lucide-react';
import * as DialogPrimitive from '@radix-ui/react-dialog';
import { cn } from "@/lib/utils"
import { Button } from "@/components/ui/button"
import { cn } from '@/lib/utils';
import { Button } from '@/components/ui/button';
function Dialog({
...props
}: React.ComponentProps<typeof DialogPrimitive.Root>) {
return <DialogPrimitive.Root data-slot="dialog" {...props} />
function Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>) {
return <DialogPrimitive.Root data-slot="dialog" {...props} />;
}
function DialogTrigger({
...props
}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {
return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />
function DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>) {
return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />;
}
function DialogPortal({
...props
}: React.ComponentProps<typeof DialogPrimitive.Portal>) {
return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />
function DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>) {
return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />;
}
function DialogClose({
...props
}: React.ComponentProps<typeof DialogPrimitive.Close>) {
return <DialogPrimitive.Close data-slot="dialog-close" {...props} />
function DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>) {
return <DialogPrimitive.Close data-slot="dialog-close" {...props} />;
}
function DialogOverlay({
@@ -39,12 +31,12 @@ function DialogOverlay({
<DialogPrimitive.Overlay
data-slot="dialog-overlay"
className={cn(
"fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0",
'fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0',
className
)}
{...props}
/>
)
);
}
function DialogContent({
@@ -53,7 +45,7 @@ function DialogContent({
showCloseButton = true,
...props
}: React.ComponentProps<typeof DialogPrimitive.Content> & {
showCloseButton?: boolean
showCloseButton?: boolean;
}) {
return (
<DialogPortal data-slot="dialog-portal">
@@ -61,7 +53,7 @@ function DialogContent({
<DialogPrimitive.Content
data-slot="dialog-content"
className={cn(
"fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border bg-background p-6 shadow-lg duration-200 outline-none data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg",
'fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border bg-background p-6 shadow-lg duration-200 outline-none data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg',
className
)}
{...props}
@@ -78,17 +70,17 @@ function DialogContent({
)}
</DialogPrimitive.Content>
</DialogPortal>
)
);
}
function DialogHeader({ className, ...props }: React.ComponentProps<"div">) {
function DialogHeader({ className, ...props }: React.ComponentProps<'div'>) {
return (
<div
data-slot="dialog-header"
className={cn("flex flex-col gap-2 text-center sm:text-left", className)}
className={cn('flex flex-col gap-2 text-center sm:text-left', className)}
{...props}
/>
)
);
}
function DialogFooter({
@@ -96,16 +88,13 @@ function DialogFooter({
showCloseButton = false,
children,
...props
}: React.ComponentProps<"div"> & {
showCloseButton?: boolean
}: React.ComponentProps<'div'> & {
showCloseButton?: boolean;
}) {
return (
<div
data-slot="dialog-footer"
className={cn(
"flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
className
)}
className={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', className)}
{...props}
>
{children}
@@ -115,20 +104,17 @@ function DialogFooter({
</DialogPrimitive.Close>
)}
</div>
)
);
}
function DialogTitle({
className,
...props
}: React.ComponentProps<typeof DialogPrimitive.Title>) {
function DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>) {
return (
<DialogPrimitive.Title
data-slot="dialog-title"
className={cn("text-lg leading-none font-semibold", className)}
className={cn('text-lg leading-none font-semibold', className)}
{...props}
/>
)
);
}
function DialogDescription({
@@ -138,10 +124,10 @@ function DialogDescription({
return (
<DialogPrimitive.Description
data-slot="dialog-description"
className={cn("text-sm text-muted-foreground", className)}
className={cn('text-sm text-muted-foreground', className)}
{...props}
/>
)
);
}
export {
@@ -155,4 +141,4 @@ export {
DialogPortal,
DialogTitle,
DialogTrigger,
}
};
src/renderer/components/ui/form.tsx
+45 -59
View File
@@ -1,75 +1,71 @@
"use client"
'use client';
import * as React from "react"
import * as LabelPrimitive from "@radix-ui/react-label"
import { Slot } from "@radix-ui/react-slot"
import * as React from 'react';
import * as LabelPrimitive from '@radix-ui/react-label';
import { Slot } from '@radix-ui/react-slot';
import {
Controller,
type ControllerProps,
type FieldPath,
type FieldValues,
useFormContext,
} from "react-hook-form"
} from 'react-hook-form';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
const Form = React.forwardRef<
HTMLFormElement,
React.ComponentProps<"form">
>(({ className, ...props }, ref) => {
const methods = useFormContext()
return (
<form ref={ref} className={className} onSubmit={methods.handleSubmit(() => {})} {...props} />
)
})
Form.displayName = "Form"
const Form = React.forwardRef<HTMLFormElement, React.ComponentProps<'form'>>(
({ className, ...props }, ref) => {
const methods = useFormContext();
return (
<form ref={ref} className={className} onSubmit={methods.handleSubmit(() => {})} {...props} />
);
}
);
Form.displayName = 'Form';
// ============================================================
// FormFieldContext - provides field-level context
// ============================================================
const FormFieldContext = React.createContext<
ControllerProps<FieldValues, string>
>({} as never)
const FormFieldContext = React.createContext<ControllerProps<FieldValues, string>>({} as never);
const FormField = <
TFieldValues extends FieldValues = FieldValues,
TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
>({
...props
}: ControllerProps<TFieldValues, TName>) => {
const { name } = props
const { name } = props;
return (
<FormFieldContext.Provider value={props as ControllerProps<FieldValues, string>}>
<Controller {...props} />
</FormFieldContext.Provider>
)
}
);
};
// ============================================================
// useFormField - must be used inside a FormField
// ============================================================
function useFormField(): ControllerProps<FieldValues, string> {
const fieldContext = React.useContext(FormFieldContext)
const fieldContext = React.useContext(FormFieldContext);
if (!fieldContext) {
throw new Error("useFormField must be used within a FormField")
throw new Error('useFormField must be used within a FormField');
}
return fieldContext
return fieldContext;
}
// ============================================================
// FormItem - wraps a labeled form control
// ============================================================
const FormItem = React.forwardRef<
HTMLDivElement,
React.HTMLAttributes<HTMLDivElement>
>(({ className, ...props }, ref) => (
<div ref={ref} className={cn("space-y-2", className)} {...props} />
))
FormItem.displayName = "FormItem"
const FormItem = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
({ className, ...props }, ref) => (
<div ref={ref} className={cn('space-y-2', className)} {...props} />
)
);
FormItem.displayName = 'FormItem';
// ============================================================
// FormLabel
@@ -82,13 +78,13 @@ const FormLabel = React.forwardRef<
<LabelPrimitive.Root
ref={ref}
className={cn(
"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70',
className
)}
{...props}
/>
))
FormLabel.displayName = LabelPrimitive.Root.displayName
));
FormLabel.displayName = LabelPrimitive.Root.displayName;
// ============================================================
// FormControl - Slot bridge
@@ -97,10 +93,8 @@ FormLabel.displayName = LabelPrimitive.Root.displayName
const FormControl = React.forwardRef<
React.ElementRef<typeof Slot>,
React.ComponentPropsWithoutRef<typeof Slot>
>(({ ...props }, ref) => (
<Slot ref={ref} {...props} />
))
FormControl.displayName = "FormControl"
>(({ ...props }, ref) => <Slot ref={ref} {...props} />);
FormControl.displayName = 'FormControl';
// ============================================================
// FormDescription
@@ -110,13 +104,9 @@ const FormDescription = React.forwardRef<
HTMLParagraphElement,
React.HTMLAttributes<HTMLParagraphElement>
>(({ className, ...props }, ref) => (
<p
ref={ref}
className={cn("text-sm text-muted-foreground", className)}
{...props}
/>
))
FormDescription.displayName = "FormDescription"
<p ref={ref} className={cn('text-sm text-muted-foreground', className)} {...props} />
));
FormDescription.displayName = 'FormDescription';
// ============================================================
// FormMessage
@@ -126,20 +116,16 @@ const FormMessage = React.forwardRef<
HTMLParagraphElement,
React.HTMLAttributes<HTMLParagraphElement>
>(({ className, children, ...props }, ref) => {
const { error } = useFormField()
const body = error ? String(error.message ?? "") : children
if (!body) return null
const { error } = useFormField();
const body = error ? String(error.message ?? '') : children;
if (!body) return null;
return (
<p
ref={ref}
className={cn("text-sm font-medium text-destructive", className)}
{...props}
>
<p ref={ref} className={cn('text-sm font-medium text-destructive', className)} {...props}>
{body}
</p>
)
})
FormMessage.displayName = "FormMessage"
);
});
FormMessage.displayName = 'FormMessage';
export {
Form,
@@ -150,4 +136,4 @@ export {
FormDescription,
FormMessage,
useFormField,
}
};
src/renderer/components/ui/input.tsx
+8 -9
View File
@@ -1,9 +1,8 @@
import * as React from "react"
import * as React from 'react';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
export interface InputProps
extends React.InputHTMLAttributes<HTMLInputElement> {}
export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {}
const Input = React.forwardRef<HTMLInputElement, InputProps>(
({ className, type, ...props }, ref) => {
@@ -11,15 +10,15 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
<input
type={type}
className={cn(
"h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
'h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
className
)}
ref={ref}
{...props}
/>
)
);
}
)
Input.displayName = "Input"
);
Input.displayName = 'Input';
export { Input }
export { Input };
src/renderer/components/ui/label.tsx
+7 -7
View File
@@ -1,6 +1,6 @@
import * as React from "react"
import * as LabelPrimitive from "@radix-ui/react-label"
import { cn } from "@/lib/utils"
import * as React from 'react';
import * as LabelPrimitive from '@radix-ui/react-label';
import { cn } from '@/lib/utils';
const Label = React.forwardRef<
React.ElementRef<typeof LabelPrimitive.Root>,
@@ -9,12 +9,12 @@ const Label = React.forwardRef<
<LabelPrimitive.Root
ref={ref}
className={cn(
"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70',
className
)}
{...props}
/>
))
Label.displayName = LabelPrimitive.Root.displayName
));
Label.displayName = LabelPrimitive.Root.displayName;
export { Label }
export { Label };
src/renderer/components/ui/radio-group.tsx
+12 -18
View File
@@ -1,21 +1,15 @@
import * as React from "react"
import * as RadioGroupPrimitive from "@radix-ui/react-radio-group"
import { Circle } from "lucide-react"
import { cn } from "@/lib/utils"
import * as React from 'react';
import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
import { Circle } from 'lucide-react';
import { cn } from '@/lib/utils';
const RadioGroup = React.forwardRef<
React.ElementRef<typeof RadioGroupPrimitive.Root>,
React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>
>(({ className, ...props }, ref) => {
return (
<RadioGroupPrimitive.Root
className={cn("grid gap-2", className)}
{...props}
ref={ref}
/>
)
})
RadioGroup.displayName = RadioGroupPrimitive.Root.displayName
return <RadioGroupPrimitive.Root className={cn('grid gap-2', className)} {...props} ref={ref} />;
});
RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
const RadioGroupItem = React.forwardRef<
React.ElementRef<typeof RadioGroupPrimitive.Item>,
@@ -25,7 +19,7 @@ const RadioGroupItem = React.forwardRef<
<RadioGroupPrimitive.Item
ref={ref}
className={cn(
"aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
'aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
className
)}
{...props}
@@ -34,8 +28,8 @@ const RadioGroupItem = React.forwardRef<
<Circle className="h-2.5 w-2.5 fill-current text-current" />
</RadioGroupPrimitive.Indicator>
</RadioGroupPrimitive.Item>
)
})
RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName
);
});
RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
export { RadioGroup, RadioGroupItem }
export { RadioGroup, RadioGroupItem };
src/renderer/components/ui/resizable.tsx
+16 -22
View File
@@ -1,10 +1,10 @@
"use client"
'use client';
import * as React from "react"
import { GripVertical } from "lucide-react"
import * as ResizablePrimitive from "react-resizable-panels"
import * as React from 'react';
import { GripVertical } from 'lucide-react';
import * as ResizablePrimitive from 'react-resizable-panels';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
const ResizablePanelGroup = React.forwardRef<
React.ElementRef<typeof ResizablePrimitive.Group>,
@@ -12,14 +12,11 @@ const ResizablePanelGroup = React.forwardRef<
>(({ className, ...props }, ref) => (
<ResizablePrimitive.Group
ref={ref}
className={cn(
"flex h-full w-full data-[panel-group-direction=vertical]:flex-col",
className
)}
className={cn('flex h-full w-full data-[panel-group-direction=vertical]:flex-col', className)}
{...props}
/>
))
ResizablePanelGroup.displayName = "ResizablePanelGroup"
));
ResizablePanelGroup.displayName = 'ResizablePanelGroup';
const ResizablePanel = React.forwardRef<
React.ElementRef<typeof ResizablePrimitive.Panel>,
@@ -27,25 +24,22 @@ const ResizablePanel = React.forwardRef<
>(({ className, ...props }, ref) => (
<ResizablePrimitive.Panel
ref={ref}
className={cn(
"h-full w-full overflow-hidden",
className
)}
className={cn('h-full w-full overflow-hidden', className)}
{...props}
/>
))
ResizablePanel.displayName = "ResizablePanel"
));
ResizablePanel.displayName = 'ResizablePanel';
const ResizableHandle = ({
withHandle,
className,
...props
}: React.ComponentPropsWithoutRef<typeof ResizablePrimitive.Separator> & {
withHandle?: boolean
withHandle?: boolean;
}) => (
<ResizablePrimitive.Separator
className={cn(
"relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0 [&[data-panel-group-direction=vertical]>div]:rotate-90",
'relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0 [&[data-panel-group-direction=vertical]>div]:rotate-90',
className
)}
{...props}
@@ -56,7 +50,7 @@ const ResizableHandle = ({
</div>
)}
</ResizablePrimitive.Separator>
)
ResizableHandle.displayName = "ResizableHandle"
);
ResizableHandle.displayName = 'ResizableHandle';
export { ResizablePanelGroup, ResizablePanel, ResizableHandle }
export { ResizablePanelGroup, ResizablePanel, ResizableHandle };
src/renderer/components/ui/scroll-area.tsx
+14 -16
View File
@@ -1,9 +1,9 @@
"use client"
'use client';
import * as React from "react"
import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area"
import * as React from 'react';
import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
const ScrollArea = React.forwardRef<
React.ElementRef<typeof ScrollAreaPrimitive.Root>,
@@ -11,7 +11,7 @@ const ScrollArea = React.forwardRef<
>(({ className, children, ...props }, ref) => (
<ScrollAreaPrimitive.Root
ref={ref}
className={cn("relative overflow-hidden", className)}
className={cn('relative overflow-hidden', className)}
{...props}
>
<ScrollAreaPrimitive.Viewport className="h-full w-full rounded-[inherit]">
@@ -20,28 +20,26 @@ const ScrollArea = React.forwardRef<
<ScrollBar />
<ScrollAreaPrimitive.Corner />
</ScrollAreaPrimitive.Root>
))
ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName
));
ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
const ScrollBar = React.forwardRef<
React.ElementRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>,
React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>
>(({ className, orientation = "vertical", ...props }, ref) => (
>(({ className, orientation = 'vertical', ...props }, ref) => (
<ScrollAreaPrimitive.ScrollAreaScrollbar
ref={ref}
orientation={orientation}
className={cn(
"flex touch-none select-none transition-colors",
orientation === "vertical" &&
"h-full w-2.5 border-l border-l-transparent p-[1px]",
orientation === "horizontal" &&
"h-2.5 flex-col border-t border-t-transparent p-[1px]",
'flex touch-none select-none transition-colors',
orientation === 'vertical' && 'h-full w-2.5 border-l border-l-transparent p-[1px]',
orientation === 'horizontal' && 'h-2.5 flex-col border-t border-t-transparent p-[1px]',
className
)}
{...props}
>
<ScrollAreaPrimitive.ScrollAreaThumb className="relative flex-1 rounded-full bg-border" />
</ScrollAreaPrimitive.ScrollAreaScrollbar>
))
ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName
export { ScrollArea, ScrollBar }
));
ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
export { ScrollArea, ScrollBar };
src/renderer/components/ui/select.tsx
+36 -43
View File
@@ -1,15 +1,15 @@
"use client"
'use client';
import * as React from "react"
import * as SelectPrimitive from "@radix-ui/react-select"
import { Check, ChevronDown, ChevronUp } from "lucide-react"
import { cn } from "@/lib/utils"
import * as React from 'react';
import * as SelectPrimitive from '@radix-ui/react-select';
import { Check, ChevronDown, ChevronUp } from 'lucide-react';
import { cn } from '@/lib/utils';
const Select = SelectPrimitive.Root
const Select = SelectPrimitive.Root;
const SelectGroup = SelectPrimitive.Group
const SelectGroup = SelectPrimitive.Group;
const SelectValue = SelectPrimitive.Value
const SelectValue = SelectPrimitive.Value;
const SelectTrigger = React.forwardRef<
React.ElementRef<typeof SelectPrimitive.Trigger>,
@@ -18,7 +18,7 @@ const SelectTrigger = React.forwardRef<
<SelectPrimitive.Trigger
ref={ref}
className={cn(
"flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
'flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',
className
)}
{...props}
@@ -28,8 +28,8 @@ const SelectTrigger = React.forwardRef<
<ChevronDown className="h-4 w-4 opacity-50" />
</SelectPrimitive.Icon>
</SelectPrimitive.Trigger>
))
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName
));
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
const SelectScrollUpButton = React.forwardRef<
React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
@@ -37,16 +37,13 @@ const SelectScrollUpButton = React.forwardRef<
>(({ className, ...props }, ref) => (
<SelectPrimitive.ScrollUpButton
ref={ref}
className={cn(
"flex cursor-default items-center justify-center py-1",
className
)}
className={cn('flex cursor-default items-center justify-center py-1', className)}
{...props}
>
<ChevronUp className="h-4 w-4" />
</SelectPrimitive.ScrollUpButton>
))
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName
));
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
const SelectScrollDownButton = React.forwardRef<
React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
@@ -54,29 +51,25 @@ const SelectScrollDownButton = React.forwardRef<
>(({ className, ...props }, ref) => (
<SelectPrimitive.ScrollDownButton
ref={ref}
className={cn(
"flex cursor-default items-center justify-center py-1",
className
)}
className={cn('flex cursor-default items-center justify-center py-1', className)}
{...props}
>
<ChevronDown className="h-4 w-4" />
</SelectPrimitive.ScrollDownButton>
))
SelectScrollDownButton.displayName =
SelectPrimitive.ScrollDownButton.displayName
));
SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
const SelectContent = React.forwardRef<
React.ElementRef<typeof SelectPrimitive.Content>,
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>
>(({ className, children, position = "popper", ...props }, ref) => (
>(({ className, children, position = 'popper', ...props }, ref) => (
<SelectPrimitive.Portal>
<SelectPrimitive.Content
ref={ref}
className={cn(
"relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
position === "popper" &&
"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
'relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
position === 'popper' &&
'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',
className
)}
position={position}
@@ -85,9 +78,9 @@ const SelectContent = React.forwardRef<
<SelectScrollUpButton />
<SelectPrimitive.Viewport
className={cn(
"p-1",
position === "popper" &&
"h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
'p-1',
position === 'popper' &&
'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]'
)}
>
{children}
@@ -95,8 +88,8 @@ const SelectContent = React.forwardRef<
<SelectScrollDownButton />
</SelectPrimitive.Content>
</SelectPrimitive.Portal>
))
SelectContent.displayName = SelectPrimitive.Content.displayName
));
SelectContent.displayName = SelectPrimitive.Content.displayName;
const SelectLabel = React.forwardRef<
React.ElementRef<typeof SelectPrimitive.Label>,
@@ -104,11 +97,11 @@ const SelectLabel = React.forwardRef<
>(({ className, ...props }, ref) => (
<SelectPrimitive.Label
ref={ref}
className={cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className)}
className={cn('py-1.5 pl-8 pr-2 text-sm font-semibold', className)}
{...props}
/>
))
SelectLabel.displayName = SelectPrimitive.Label.displayName
));
SelectLabel.displayName = SelectPrimitive.Label.displayName;
const SelectItem = React.forwardRef<
React.ElementRef<typeof SelectPrimitive.Item>,
@@ -117,7 +110,7 @@ const SelectItem = React.forwardRef<
<SelectPrimitive.Item
ref={ref}
className={cn(
"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
'relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
className
)}
{...props}
@@ -130,8 +123,8 @@ const SelectItem = React.forwardRef<
<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
</SelectPrimitive.Item>
))
SelectItem.displayName = SelectPrimitive.Item.displayName
));
SelectItem.displayName = SelectPrimitive.Item.displayName;
const SelectSeparator = React.forwardRef<
React.ElementRef<typeof SelectPrimitive.Separator>,
@@ -139,11 +132,11 @@ const SelectSeparator = React.forwardRef<
>(({ className, ...props }, ref) => (
<SelectPrimitive.Separator
ref={ref}
className={cn("-mx-1 my-1 h-px bg-muted", className)}
className={cn('-mx-1 my-1 h-px bg-muted', className)}
{...props}
/>
))
SelectSeparator.displayName = SelectPrimitive.Separator.displayName
));
SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
export {
Select,
@@ -156,4 +149,4 @@ export {
SelectSeparator,
SelectScrollUpButton,
SelectScrollDownButton,
}
};
src/renderer/components/ui/sheet.tsx
+47 -68
View File
@@ -1,25 +1,22 @@
"use client"
'use client';
import * as React from "react"
import * as SheetPrimitive from "@radix-ui/react-dialog"
import { cva, type VariantProps } from "class-variance-authority"
import { X } from "lucide-react"
import * as React from 'react';
import * as SheetPrimitive from '@radix-ui/react-dialog';
import { cva, type VariantProps } from 'class-variance-authority';
import { X } from 'lucide-react';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
const Sheet = SheetPrimitive.Root
const Sheet = SheetPrimitive.Root;
const SheetTrigger = SheetPrimitive.Trigger
const SheetTrigger = SheetPrimitive.Trigger;
const SheetClose = SheetPrimitive.Close
const SheetClose = SheetPrimitive.Close;
const SheetPortal = ({
className,
...props
}: SheetPrimitive.DialogPortalProps) => (
const SheetPortal = ({ className, ...props }: SheetPrimitive.DialogPortalProps) => (
<SheetPrimitive.Portal className={cn(className)} {...props} />
)
SheetPortal.displayName = SheetPrimitive.Portal.displayName
);
SheetPortal.displayName = SheetPrimitive.Portal.displayName;
const SheetOverlay = React.forwardRef<
React.ElementRef<typeof SheetPrimitive.Overlay>,
@@ -27,49 +24,46 @@ const SheetOverlay = React.forwardRef<
>(({ className, ...props }, ref) => (
<SheetPrimitive.Overlay
className={cn(
"fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0",
'fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0',
className
)}
{...props}
ref={ref}
/>
))
SheetOverlay.displayName = SheetPrimitive.Overlay.displayName
));
SheetOverlay.displayName = SheetPrimitive.Overlay.displayName;
const sheetVariants = cva(
"fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:animate-in data-[state=open]:duration-500",
'fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:animate-in data-[state=open]:duration-500',
{
variants: {
side: {
top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
top: 'inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top',
bottom:
"inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
'inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom',
left: 'inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm',
right:
"inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm"
}
'inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm',
},
},
defaultVariants: {
side: "right"
}
side: 'right',
},
}
)
);
interface SheetContentProps
extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,
extends
React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,
VariantProps<typeof sheetVariants> {}
const SheetContent = React.forwardRef<
React.ElementRef<typeof SheetPrimitive.Content>,
SheetContentProps
>(({ side = "right", className, children, ...props }, ref) => (
>(({ side = 'right', className, children, ...props }, ref) => (
<SheetPortal>
<SheetOverlay />
<SheetPrimitive.Content
ref={ref}
className={cn(sheetVariants({ side }), className)}
{...props}
>
<SheetPrimitive.Content ref={ref} className={cn(sheetVariants({ side }), className)} {...props}>
{children}
<SheetPrimitive.Close className="absolute top-4 right-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:outline-none disabled:pointer-events-none data-[state=open]:bg-secondary">
<X className="h-4 w-4" />
@@ -77,36 +71,21 @@ const SheetContent = React.forwardRef<
</SheetPrimitive.Close>
</SheetPrimitive.Content>
</SheetPortal>
))
SheetContent.displayName = SheetPrimitive.Content.displayName
));
SheetContent.displayName = SheetPrimitive.Content.displayName;
const SheetHeader = ({
className,
...props
}: React.HTMLAttributes<HTMLDivElement>) => (
const SheetHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
<div className={cn('flex flex-col space-y-2 text-center sm:text-left', className)} {...props} />
);
SheetHeader.displayName = 'SheetHeader';
const SheetFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
<div
className={cn(
"flex flex-col space-y-2 text-center sm:text-left",
className
)}
className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)}
{...props}
/>
)
SheetHeader.displayName = "SheetHeader"
const SheetFooter = ({
className,
...props
}: React.HTMLAttributes<HTMLDivElement>) => (
<div
className={cn(
"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
className
)}
{...props}
/>
)
SheetFooter.displayName = "SheetFooter"
);
SheetFooter.displayName = 'SheetFooter';
const SheetTitle = React.forwardRef<
React.ElementRef<typeof SheetPrimitive.Title>,
@@ -114,11 +93,11 @@ const SheetTitle = React.forwardRef<
>(({ className, ...props }, ref) => (
<SheetPrimitive.Title
ref={ref}
className={cn("text-lg font-semibold text-foreground", className)}
className={cn('text-lg font-semibold text-foreground', className)}
{...props}
/>
))
SheetTitle.displayName = SheetPrimitive.Title.displayName
));
SheetTitle.displayName = SheetPrimitive.Title.displayName;
const SheetDescription = React.forwardRef<
React.ElementRef<typeof SheetPrimitive.Description>,
@@ -126,11 +105,11 @@ const SheetDescription = React.forwardRef<
>(({ className, ...props }, ref) => (
<SheetPrimitive.Description
ref={ref}
className={cn("text-sm text-muted-foreground", className)}
className={cn('text-sm text-muted-foreground', className)}
{...props}
/>
))
SheetDescription.displayName = SheetPrimitive.Description.displayName
));
SheetDescription.displayName = SheetPrimitive.Description.displayName;
export {
Sheet,
@@ -142,5 +121,5 @@ export {
SheetHeader,
SheetFooter,
SheetTitle,
SheetDescription
}
SheetDescription,
};
src/renderer/components/ui/slider.tsx
+8 -11
View File
@@ -1,8 +1,8 @@
"use client"
'use client';
import * as React from "react"
import * as SliderPrimitive from "@radix-ui/react-slider"
import { cn } from "@/lib/utils"
import * as React from 'react';
import * as SliderPrimitive from '@radix-ui/react-slider';
import { cn } from '@/lib/utils';
const Slider = React.forwardRef<
React.ElementRef<typeof SliderPrimitive.Root>,
@@ -12,10 +12,7 @@ const Slider = React.forwardRef<
return (
<SliderPrimitive.Root
ref={ref}
className={cn(
"relative flex w-full touch-none select-none items-center",
className
)}
className={cn('relative flex w-full touch-none select-none items-center', className)}
{...rest}
>
<SliderPrimitive.Track className="relative h-2 w-full grow overflow-hidden rounded-full bg-secondary">
@@ -27,7 +24,7 @@ const Slider = React.forwardRef<
/>
</SliderPrimitive.Root>
);
})
Slider.displayName = SliderPrimitive.Root.displayName
});
Slider.displayName = SliderPrimitive.Root.displayName;
export { Slider }
export { Slider };
src/renderer/components/ui/sonner.tsx
+13 -15
View File
@@ -1,26 +1,24 @@
"use client"
'use client';
import { useTheme } from "next-themes"
import { Toaster as Sonner } from "sonner"
import { useTheme } from 'next-themes';
import { Toaster as Sonner } from 'sonner';
type ToasterProps = React.ComponentProps<typeof Sonner>
type ToasterProps = React.ComponentProps<typeof Sonner>;
const Toaster = ({ ...props }: ToasterProps) => {
const { theme = "system" } = useTheme()
const { theme = 'system' } = useTheme();
return (
<Sonner
theme={theme as ToasterProps["theme"]}
theme={theme as ToasterProps['theme']}
className="toaster group"
toastOptions={{
classNames: {
toast:
"group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
description: "group-[.toast]:text-muted-foreground",
actionButton:
"group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
cancelButton:
"group-[.toast]:bg-muted group-[.toast]:text-muted-foreground",
'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',
description: 'group-[.toast]:text-muted-foreground',
actionButton: 'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',
cancelButton: 'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',
},
}}
richColors
@@ -28,7 +26,7 @@ const Toaster = ({ ...props }: ToasterProps) => {
position="bottom-right"
{...props}
/>
)
}
);
};
export { Toaster }
export { Toaster };
src/renderer/components/ui/switch.tsx
+8 -8
View File
@@ -1,6 +1,6 @@
import * as React from "react"
import * as SwitchPrimitive from "@radix-ui/react-switch"
import { cn } from "@/lib/utils"
import * as React from 'react';
import * as SwitchPrimitive from '@radix-ui/react-switch';
import { cn } from '@/lib/utils';
const Switch = React.forwardRef<
React.ElementRef<typeof SwitchPrimitive.Root>,
@@ -9,18 +9,18 @@ const Switch = React.forwardRef<
<SwitchPrimitive.Root
ref={ref}
className={cn(
"peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
'peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input',
className
)}
{...props}
>
<SwitchPrimitive.Thumb
className={cn(
"pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
'pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0'
)}
/>
</SwitchPrimitive.Root>
))
Switch.displayName = SwitchPrimitive.Root.displayName
));
Switch.displayName = SwitchPrimitive.Root.displayName;
export { Switch }
export { Switch };
src/renderer/components/ui/tabs.tsx
+25 -35
View File
@@ -1,14 +1,14 @@
"use client"
'use client';
import * as React from "react"
import { cva, type VariantProps } from "class-variance-authority"
import * as TabsPrimitive from "@radix-ui/react-tabs"
import * as React from 'react';
import { cva, type VariantProps } from 'class-variance-authority';
import * as TabsPrimitive from '@radix-ui/react-tabs';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
function Tabs({
className,
orientation = "horizontal",
orientation = 'horizontal',
...props
}: React.ComponentProps<typeof TabsPrimitive.Root>) {
return (
@@ -16,36 +16,32 @@ function Tabs({
data-slot="tabs"
data-orientation={orientation}
orientation={orientation}
className={cn(
"group/tabs flex gap-2 data-[orientation=horizontal]:flex-col",
className
)}
className={cn('group/tabs flex gap-2 data-[orientation=horizontal]:flex-col', className)}
{...props}
/>
)
);
}
const tabsListVariants = cva(
"group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-[orientation=horizontal]/tabs:h-9 group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col data-[variant=line]:rounded-none",
'group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-[orientation=horizontal]/tabs:h-9 group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col data-[variant=line]:rounded-none',
{
variants: {
variant: {
default: "bg-muted",
line: "gap-1 bg-transparent",
default: 'bg-muted',
line: 'gap-1 bg-transparent',
},
},
defaultVariants: {
variant: "default",
variant: 'default',
},
}
)
);
function TabsList({
className,
variant = "default",
variant = 'default',
...props
}: React.ComponentProps<typeof TabsPrimitive.List> &
VariantProps<typeof tabsListVariants>) {
}: React.ComponentProps<typeof TabsPrimitive.List> & VariantProps<typeof tabsListVariants>) {
return (
<TabsPrimitive.List
data-slot="tabs-list"
@@ -53,39 +49,33 @@ function TabsList({
className={cn(tabsListVariants({ variant }), className)}
{...props}
/>
)
);
}
function TabsTrigger({
className,
...props
}: React.ComponentProps<typeof TabsPrimitive.Trigger>) {
function TabsTrigger({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Trigger>) {
return (
<TabsPrimitive.Trigger
data-slot="tabs-trigger"
className={cn(
"relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 group-data-[variant=default]/tabs-list:data-[state=active]:shadow-sm group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none dark:text-muted-foreground dark:hover:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
"group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:border-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent",
"data-[state=active]:bg-background data-[state=active]:text-foreground dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 dark:data-[state=active]:text-foreground",
"after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-[state=active]:after:opacity-100",
'group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:border-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent',
'data-[state=active]:bg-background data-[state=active]:text-foreground dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 dark:data-[state=active]:text-foreground',
'after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-[state=active]:after:opacity-100',
className
)}
{...props}
/>
)
);
}
function TabsContent({
className,
...props
}: React.ComponentProps<typeof TabsPrimitive.Content>) {
function TabsContent({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Content>) {
return (
<TabsPrimitive.Content
data-slot="tabs-content"
className={cn("flex-1 outline-none", className)}
className={cn('flex-1 outline-none', className)}
{...props}
/>
)
);
}
export { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants }
export { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants };
src/renderer/components/ui/textarea.tsx
+8 -9
View File
@@ -1,24 +1,23 @@
import * as React from "react"
import * as React from 'react';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
export interface TextareaProps
extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
export interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
({ className, ...props }, ref) => {
return (
<textarea
className={cn(
"flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
'flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
className
)}
ref={ref}
{...props}
/>
)
);
}
)
Textarea.displayName = "Textarea"
);
Textarea.displayName = 'Textarea';
export { Textarea }
export { Textarea };
src/renderer/hooks/use-file-shortcuts.ts
+6 -2
View File
@@ -59,8 +59,12 @@ export function useFileShortcuts(): void {
const idx = activeTabId ? openTabs.findIndex((t) => t.id === activeTabId) : 0;
const safeIdx = idx === -1 ? 0 : idx;
const nextIdx = e.shiftKey
? (safeIdx <= 0 ? openTabs.length - 1 : safeIdx - 1)
: (safeIdx >= openTabs.length - 1 ? 0 : safeIdx + 1);
? safeIdx <= 0
? openTabs.length - 1
: safeIdx - 1
: safeIdx >= openTabs.length - 1
? 0
: safeIdx + 1;
setActiveTab(openTabs[nextIdx].id);
return;
}
src/renderer/hooks/use-scroll-sync.ts
+19 -13
View File
@@ -9,20 +9,26 @@ export function useScrollSync(opts: Options) {
const FRAME_MS = 1000 / 60;
const lastTick = useRef(-FRAME_MS);
const handleEditorScroll = useCallback((evt: React.UIEvent<HTMLElement>) => {
const target = evt.currentTarget;
const ratio = target.scrollTop / Math.max(target.scrollHeight - target.clientHeight, 1);
const now = performance.now();
if (now - lastTick.current < FRAME_MS) return;
lastTick.current = now;
opts.onEditorScroll?.(ratio);
}, [opts]);
const handleEditorScroll = useCallback(
(evt: React.UIEvent<HTMLElement>) => {
const target = evt.currentTarget;
const ratio = target.scrollTop / Math.max(target.scrollHeight - target.clientHeight, 1);
const now = performance.now();
if (now - lastTick.current < FRAME_MS) return;
lastTick.current = now;
opts.onEditorScroll?.(ratio);
},
[opts]
);
const handlePreviewScroll = useCallback((evt: React.UIEvent<HTMLElement>) => {
const target = evt.currentTarget;
const ratio = target.scrollTop / Math.max(target.scrollHeight - target.clientHeight, 1);
opts.onPreviewScroll?.(ratio);
}, [opts]);
const handlePreviewScroll = useCallback(
(evt: React.UIEvent<HTMLElement>) => {
const target = evt.currentTarget;
const ratio = target.scrollTop / Math.max(target.scrollHeight - target.clientHeight, 1);
opts.onPreviewScroll?.(ratio);
},
[opts]
);
return { handleEditorScroll, handlePreviewScroll };
}
src/renderer/hooks/useAutoUpdateCheck.ts
+3 -1
View File
@@ -7,7 +7,9 @@ export function useAutoUpdateCheck() {
const check = useUpdaterStore((s) => s.check);
useEffect(() => {
if (auto) {
const t = setTimeout(() => { check(); }, 5_000);
const t = setTimeout(() => {
check();
}, 5_000);
return () => clearTimeout(t);
}
}, [auto, check]);
src/renderer/index.html
+20 -14
View File
@@ -1,16 +1,22 @@
<!DOCTYPE html>
<!doctype html>
<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'; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; img-src 'self' data: blob:; font-src 'self' data: https://fonts.gstatic.com; connect-src 'self' https://fonts.googleapis.com https://fonts.gstatic.com;">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MarkdownConverter</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&display=swap" rel="stylesheet">
</head>
<body class="font-sans antialiased">
<div id="root"></div>
<script type="module" src="./main.tsx"></script>
</body>
<head>
<meta charset="UTF-8" />
<meta
http-equiv="Content-Security-Policy"
content="default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; img-src 'self' data: blob:; font-src 'self' data: https://fonts.gstatic.com; connect-src 'self' https://fonts.googleapis.com https://fonts.gstatic.com;"
/>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>MarkdownConverter</title>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&display=swap"
rel="stylesheet"
/>
</head>
<body class="font-sans antialiased">
<div id="root"></div>
<script type="module" src="./main.tsx"></script>
</body>
</html>
src/renderer/lib/ascii-table.ts
+13 -6
View File
@@ -14,10 +14,11 @@ export function toAsciiTable(rows: string[][]): string {
const pad = rightAlign
? (s: string, w: number) => s.padStart(w)
: (s: string, w: number) => s.padEnd(w);
const lines = rows.map((row) =>
'| ' +
Array.from({ length: numCols }, (_, c) => pad(row[c] ?? '', widths[c])).join(' | ') +
' |'
const lines = rows.map(
(row) =>
'| ' +
Array.from({ length: numCols }, (_, c) => pad(row[c] ?? '', widths[c])).join(' | ') +
' |'
);
// Insert separator after first row
const sep =
@@ -35,9 +36,15 @@ const TABLE_RE = /^\|.+\|\n^\|[\s:|-]+\|\n((?:^\|.+\|\n?)+)/gm;
export function applyAsciiTransform(source: string): string {
return source.replace(TABLE_RE, (block) => {
const lines = block.trim().split('\n');
const header = lines[0].slice(1, -1).split('|').map((s) => s.trim());
const header = lines[0]
.slice(1, -1)
.split('|')
.map((s) => s.trim());
const body = lines.slice(2).map((l) =>
l.slice(1, -1).split('|').map((s) => s.trim())
l
.slice(1, -1)
.split('|')
.map((s) => s.trim())
);
return '```\n' + toAsciiTable([header, ...body]) + '\n```';
});
src/renderer/lib/commands/register-menu-commands.ts
+23 -13
View File
@@ -170,7 +170,7 @@ export function registerMenuCommands(): void {
useAppStore.getState().toggleSidebar();
}
const target = document.querySelector(
`[data-testid="sidebar-jump-${panel}"]`,
`[data-testid="sidebar-jump-${panel}"]`
) as HTMLButtonElement | null;
target?.click();
},
@@ -184,7 +184,11 @@ export function registerMenuCommands(): void {
const settings = useSettingsStore.getState();
const cur = settings.editorFontSize ?? 14;
const next =
direction === 'increase' ? Math.min(28, cur + 1) : direction === 'decrease' ? Math.max(10, cur - 1) : 14;
direction === 'increase'
? Math.min(28, cur + 1)
: direction === 'decrease'
? Math.max(10, cur - 1)
: 14;
settings.setSetting('editorFontSize', next);
},
@@ -202,16 +206,24 @@ export function registerMenuCommands(): void {
'template.load': (name?: string) => {
if (!name) return;
const templates: Record<string, string> = {
'blog-post.md': '# Blog Post\n\n_Author • Date_\n\n## Introduction\n\n## Body\n\n## Conclusion\n',
'meeting-notes.md': '# Meeting Notes\n\n**Date:** \n**Attendees:** \n\n## Agenda\n\n## Discussion\n\n## Action items\n',
'technical-spec.md': '# Technical Specification\n\n## Overview\n\n## Goals\n\n## Design\n\n## Implementation\n\n## Testing\n',
'changelog.md': '# Changelog\n\n## [Unreleased]\n\n### Added\n- \n\n### Changed\n- \n\n### Fixed\n- \n',
'blog-post.md':
'# Blog Post\n\n_Author • Date_\n\n## Introduction\n\n## Body\n\n## Conclusion\n',
'meeting-notes.md':
'# Meeting Notes\n\n**Date:** \n**Attendees:** \n\n## Agenda\n\n## Discussion\n\n## Action items\n',
'technical-spec.md':
'# Technical Specification\n\n## Overview\n\n## Goals\n\n## Design\n\n## Implementation\n\n## Testing\n',
'changelog.md':
'# Changelog\n\n## [Unreleased]\n\n### Added\n- \n\n### Changed\n- \n\n### Fixed\n- \n',
'readme.md': '# Project\n\n## Description\n\n## Installation\n\n## Usage\n\n## License\n',
'project-plan.md': '# Project Plan\n\n## Goals\n\n## Milestones\n\n## Risks\n\n## Status\n',
'api-docs.md': '# API Documentation\n\n## Authentication\n\n## Endpoints\n\n### `GET /resource`\n\n### `POST /resource`\n',
'tutorial.md': '# Tutorial\n\n## Prerequisites\n\n## Step 1\n\n## Step 2\n\n## Conclusion\n',
'release-notes.md': '# Release Notes\n\n## New features\n\n## Improvements\n\n## Bug fixes\n',
'comparison.md': '# Comparison\n\n| Option | A | B |\n|---|---|---|\n| Cost | | |\n| Speed | | |\n',
'api-docs.md':
'# API Documentation\n\n## Authentication\n\n## Endpoints\n\n### `GET /resource`\n\n### `POST /resource`\n',
'tutorial.md':
'# Tutorial\n\n## Prerequisites\n\n## Step 1\n\n## Step 2\n\n## Conclusion\n',
'release-notes.md':
'# Release Notes\n\n## New features\n\n## Improvements\n\n## Bug fixes\n',
'comparison.md':
'# Comparison\n\n| Option | A | B |\n|---|---|---|\n| Cost | | |\n| Speed | | |\n',
};
const snippet = templates[name];
if (!snippet) {
@@ -240,9 +252,7 @@ export function registerMenuCommands(): void {
}
return;
}
toast.info(
`${type.charAt(0).toUpperCase() + type.slice(1)} batch conversion — coming soon!`,
);
toast.info(`${type.charAt(0).toUpperCase() + type.slice(1)} batch conversion — coming soon!`);
},
// Document compare — no modal yet, acknowledge with toast.
src/renderer/lib/docx-export.ts
+8 -4
View File
@@ -16,10 +16,14 @@ export async function generateDocx(options: DocxOptions): Promise<Blob> {
// Headings (# ## ###) get heading styles
const lines = transformed.split('\n');
const children = lines.map((line) => {
if (line.startsWith('### ')) return new Paragraph({ text: line.slice(4), heading: HeadingLevel.HEADING_3 });
if (line.startsWith('## ')) return new Paragraph({ text: line.slice(3), heading: HeadingLevel.HEADING_2 });
if (line.startsWith('# ')) return new Paragraph({ text: line.slice(2), heading: HeadingLevel.HEADING_1 });
if (line.startsWith('```')) return new Paragraph({ text: line, alignment: AlignmentType.CENTER });
if (line.startsWith('### '))
return new Paragraph({ text: line.slice(4), heading: HeadingLevel.HEADING_3 });
if (line.startsWith('## '))
return new Paragraph({ text: line.slice(3), heading: HeadingLevel.HEADING_2 });
if (line.startsWith('# '))
return new Paragraph({ text: line.slice(2), heading: HeadingLevel.HEADING_1 });
if (line.startsWith('```'))
return new Paragraph({ text: line, alignment: AlignmentType.CENTER });
return new Paragraph({ children: [new TextRun(line)] });
});
src/renderer/lib/editor-commands.ts
+1 -5
View File
@@ -11,11 +11,7 @@
*/
import type { EditorView } from '@codemirror/view';
import { EditorView as CMEditorView } from '@codemirror/view';
import {
undo as cmUndo,
redo as cmRedo,
selectLine,
} from '@codemirror/commands';
import { undo as cmUndo, redo as cmRedo, selectLine } from '@codemirror/commands';
let activeView: EditorView | null = null;
src/renderer/lib/figlet.ts
+10 -2
View File
@@ -1,8 +1,16 @@
import figlet from 'figlet';
import type { Fonts } from 'figlet';
export const FIGLET_FONTS = ['Standard', 'Big', 'Small', 'Banner', 'Doom', 'Slant', 'Block'] as const;
export type FigletFont = typeof FIGLET_FONTS[number];
export const FIGLET_FONTS = [
'Standard',
'Big',
'Small',
'Banner',
'Doom',
'Slant',
'Block',
] as const;
export type FigletFont = (typeof FIGLET_FONTS)[number];
export function figletText(text: string, font: FigletFont): Promise<string> {
return new Promise((resolve, reject) => {
src/renderer/lib/html-export.ts
+4 -1
View File
@@ -123,5 +123,8 @@ ${body}
}
function escapeHtml(s: string): string {
return s.replace(/[&<>"']/g, (c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }[c] ?? c));
return s.replace(
/[&<>"']/g,
(c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' })[c] ?? c
);
}
src/renderer/lib/ipc.ts
+36 -24
View File
@@ -25,7 +25,7 @@ function wrap<T>(fn: () => Promise<T>): Promise<IpcResult<T | ChannelMissing>> {
(err: Error) => ({
ok: false as const,
error: { code: err.name || 'IPC_ERROR', message: err.message || String(err) },
}),
})
);
}
@@ -58,8 +58,7 @@ function safeCall<T extends (...args: any[]) => Promise<any>>(
export const ipc = {
file: {
open: (): Promise<IpcResult<FileResult | ChannelMissing>> =>
safeCall('file', 'open'),
open: (): Promise<IpcResult<FileResult | ChannelMissing>> => safeCall('file', 'open'),
read: (path: string): Promise<IpcResult<string | ChannelMissing>> =>
safeCall('file', 'read', path),
write: (path: string, content: string): Promise<IpcResult<void | ChannelMissing>> =>
@@ -76,12 +75,26 @@ export const ipc = {
}
return window.electronAPI.file.onChange(cb);
},
search: (args: { rootPath: string; query: string; isRegex: boolean; caseSensitive: boolean }): Promise<IpcResult<Array<{ filePath: string; line: number; content: string }> | ChannelMissing>> =>
safeCall('file', 'search', args),
gitStatus: (args: { rootPath: string }): Promise<IpcResult<Array<{ filePath: string; status: 'modified' | 'added' | 'deleted' | 'untracked' }> | ChannelMissing>> =>
safeCall('file', 'gitStatus', args),
writeBuffer: (args: { path: string; buffer: Uint8Array }): Promise<IpcResult<void | ChannelMissing>> =>
safeCall('file', 'writeBuffer', args),
search: (args: {
rootPath: string;
query: string;
isRegex: boolean;
caseSensitive: boolean;
}): Promise<
IpcResult<Array<{ filePath: string; line: number; content: string }> | ChannelMissing>
> => safeCall('file', 'search', args),
gitStatus: (args: {
rootPath: string;
}): Promise<
IpcResult<
| Array<{ filePath: string; status: 'modified' | 'added' | 'deleted' | 'untracked' }>
| ChannelMissing
>
> => safeCall('file', 'gitStatus', args),
writeBuffer: (args: {
path: string;
buffer: Uint8Array;
}): Promise<IpcResult<void | ChannelMissing>> => safeCall('file', 'writeBuffer', args),
setCurrent: (path: string | null): void => {
if (typeof window !== 'undefined' && (window.electronAPI as any)?.file?.setCurrent) {
(window.electronAPI as any).file.setCurrent(path);
@@ -101,17 +114,21 @@ export const ipc = {
safeCall('export', 'docx', opts),
html: (opts: HtmlOptions): Promise<IpcResult<ExportResult | ChannelMissing>> =>
safeCall('export', 'html', opts),
batch: (items: BatchItem[], opts: BatchOptions): Promise<IpcResult<BatchResult | ChannelMissing>> =>
safeCall('export', 'batch', items, opts),
batch: (
items: BatchItem[],
opts: BatchOptions
): Promise<IpcResult<BatchResult | ChannelMissing>> => safeCall('export', 'batch', items, opts),
},
app: {
getVersion: (): Promise<IpcResult<string | ChannelMissing>> =>
safeCall('app', 'getVersion'),
getVersion: (): Promise<IpcResult<string | ChannelMissing>> => safeCall('app', 'getVersion'),
openExternal: (url: string): Promise<IpcResult<void | ChannelMissing>> =>
safeCall('app', 'openExternal', url),
showItemInFolder: (path: string): Promise<IpcResult<void | ChannelMissing>> =>
safeCall('app', 'showItemInFolder', path),
showSaveDialog: (args?: { title?: string; defaultPath?: string }): Promise<IpcResult<string | null | ChannelMissing>> =>
showSaveDialog: (args?: {
title?: string;
defaultPath?: string;
}): Promise<IpcResult<string | null | ChannelMissing>> =>
safeCall('app', 'showSaveDialog', args),
},
menu: {
@@ -127,12 +144,9 @@ export const ipc = {
},
},
updater: {
check: (): Promise<IpcResult<void | ChannelMissing>> =>
safeCall('updater', 'check'),
install: (): Promise<IpcResult<void | ChannelMissing>> =>
safeCall('updater', 'install'),
getState: (): Promise<IpcResult<unknown | ChannelMissing>> =>
safeCall('updater', 'getState'),
check: (): Promise<IpcResult<void | ChannelMissing>> => safeCall('updater', 'check'),
install: (): Promise<IpcResult<void | ChannelMissing>> => safeCall('updater', 'install'),
getState: (): Promise<IpcResult<unknown | ChannelMissing>> => safeCall('updater', 'getState'),
onStatus: (cb: (payload: unknown) => void): (() => void) => {
if (typeof window === 'undefined' || !window.electronAPI?.updater?.onStatus) {
return () => {};
@@ -141,10 +155,8 @@ export const ipc = {
},
},
crash: {
read: (): Promise<IpcResult<unknown | ChannelMissing>> =>
safeCall('crash', 'read'),
openDir: (): Promise<IpcResult<void | ChannelMissing>> =>
safeCall('crash', 'openDir'),
read: (): Promise<IpcResult<unknown | ChannelMissing>> => safeCall('crash', 'read'),
openDir: (): Promise<IpcResult<void | ChannelMissing>> => safeCall('crash', 'openDir'),
delete: (filename: string): Promise<IpcResult<void | ChannelMissing>> =>
safeCall('crash', 'delete', filename),
},
src/renderer/lib/markdown.ts
+10 -1
View File
@@ -19,7 +19,16 @@ export function renderMarkdown(source: string): string {
const rawHtml = marked.parse(withPlaceholders, { async: false }) as string;
const clean = DOMPurify.sanitize(rawHtml, {
ALLOWED_ATTR: ['href', 'src', 'alt', 'title', 'class', 'data-mermaid-source', 'data-language', 'id'],
ALLOWED_ATTR: [
'href',
'src',
'alt',
'title',
'class',
'data-mermaid-source',
'data-language',
'id',
],
});
// The sanitized HTML still has placeholders; we leave the actual mermaid
src/renderer/lib/migrations/v4-to-v5.ts
+4 -1
View File
@@ -25,7 +25,10 @@ function normalizeAlreadyV5(data: Record<string, unknown>): Record<string, unkno
// zod schema on every launch. Always normalize theme against the v5 enum
// before returning, so persisted files are always valid v5.
const out = { ...data };
if (typeof out.theme !== 'string' || !v5ThemeValues.includes(out.theme as (typeof v5ThemeValues)[number])) {
if (
typeof out.theme !== 'string' ||
!v5ThemeValues.includes(out.theme as (typeof v5ThemeValues)[number])
) {
out.theme = 'system';
}
return out;
src/renderer/lib/writing-analytics.ts
+136 -21
View File
@@ -1,17 +1,115 @@
const STOP_WORDS = new Set([
'the', 'a', 'an', 'is', 'are', 'was', 'were', 'be', 'been', 'being',
'have', 'has', 'had', 'do', 'does', 'did', 'will', 'would', 'could',
'should', 'may', 'might', 'shall', 'can', 'to', 'of', 'in', 'for',
'on', 'with', 'at', 'by', 'from', 'as', 'into', 'through', 'during',
'before', 'after', 'above', 'below', 'between', 'out', 'off', 'over',
'under', 'again', 'further', 'then', 'once', 'here', 'there', 'when',
'where', 'why', 'how', 'all', 'each', 'every', 'both', 'few', 'more',
'most', 'other', 'some', 'such', 'no', 'nor', 'not', 'only', 'own',
'same', 'so', 'than', 'too', 'very', 'just', 'because', 'but', 'and',
'or', 'if', 'while', 'about', 'up', 'it', 'its', 'this', 'that',
'these', 'those', 'i', 'me', 'my', 'we', 'our', 'you', 'your', 'he',
'him', 'his', 'she', 'her', 'they', 'them', 'their', 'what', 'which',
'who', 'whom', 'also'
'the',
'a',
'an',
'is',
'are',
'was',
'were',
'be',
'been',
'being',
'have',
'has',
'had',
'do',
'does',
'did',
'will',
'would',
'could',
'should',
'may',
'might',
'shall',
'can',
'to',
'of',
'in',
'for',
'on',
'with',
'at',
'by',
'from',
'as',
'into',
'through',
'during',
'before',
'after',
'above',
'below',
'between',
'out',
'off',
'over',
'under',
'again',
'further',
'then',
'once',
'here',
'there',
'when',
'where',
'why',
'how',
'all',
'each',
'every',
'both',
'few',
'more',
'most',
'other',
'some',
'such',
'no',
'nor',
'not',
'only',
'own',
'same',
'so',
'than',
'too',
'very',
'just',
'because',
'but',
'and',
'or',
'if',
'while',
'about',
'up',
'it',
'its',
'this',
'that',
'these',
'those',
'i',
'me',
'my',
'we',
'our',
'you',
'your',
'he',
'him',
'his',
'she',
'her',
'they',
'them',
'their',
'what',
'which',
'who',
'whom',
'also',
]);
function countSyllables(word: string): number {
@@ -66,17 +164,23 @@ export function analyzeText(text: string): WritingMetrics {
avgSentenceLength: 0,
longestSentence: '',
longestSentenceLength: 0,
topWords: []
topWords: [],
};
}
const words = extractWords(text);
const wordCount = words.length;
const sentences = text.split(/[.!?]+/).map(s => s.trim()).filter(Boolean);
const sentences = text
.split(/[.!?]+/)
.map((s) => s.trim())
.filter(Boolean);
const sentenceCount = Math.max(sentences.length, 1);
const paragraphs = text.split(/\n\s*\n/).map(p => p.trim()).filter(Boolean);
const paragraphs = text
.split(/\n\s*\n/)
.map((p) => p.trim())
.filter(Boolean);
const paragraphCount = Math.max(paragraphs.length, 1);
let totalSyllables = 0;
@@ -84,16 +188,27 @@ export function analyzeText(text: string): WritingMetrics {
totalSyllables += countSyllables(w);
}
const fleschEase = wordCount > 0 ? Math.round((206.835 - 1.015 * (wordCount / sentenceCount) - 84.6 * (totalSyllables / wordCount)) * 10) / 10 : 0;
const fleschGrade = wordCount > 0 ? Math.round((0.39 * (wordCount / sentenceCount) + 11.8 * (totalSyllables / wordCount) - 15.59) * 10) / 10 : 0;
const fleschEase =
wordCount > 0
? Math.round(
(206.835 - 1.015 * (wordCount / sentenceCount) - 84.6 * (totalSyllables / wordCount)) * 10
) / 10
: 0;
const fleschGrade =
wordCount > 0
? Math.round(
(0.39 * (wordCount / sentenceCount) + 11.8 * (totalSyllables / wordCount) - 15.59) * 10
) / 10
: 0;
const readabilityLabel = getReadabilityLabel(fleschEase);
const readingTime = Math.ceil(wordCount / 200);
const speakingTime = Math.ceil(wordCount / 130);
const uniqueWords = new Set(words.map(w => w.toLowerCase()));
const uniqueWords = new Set(words.map((w) => w.toLowerCase()));
const uniqueWordCount = uniqueWords.size;
const lexicalDiversity = wordCount > 0 ? Math.round((uniqueWordCount / wordCount) * 1000) / 10 : 0;
const lexicalDiversity =
wordCount > 0 ? Math.round((uniqueWordCount / wordCount) * 1000) / 10 : 0;
const avgSentenceLength = Math.round((wordCount / sentenceCount) * 10) / 10;
@@ -138,6 +253,6 @@ export function analyzeText(text: string): WritingMetrics {
avgSentenceLength,
longestSentence,
longestSentenceLength,
topWords
topWords,
};
}
src/renderer/stores/command-store.ts
+2 -4
View File
@@ -30,10 +30,8 @@ export const useCommandStore = create<CommandState>()(
(set, get) => ({
handlers: {},
userBindings: {},
register: (id, handler) =>
set((s) => ({ handlers: { ...s.handlers, [id]: handler } })),
registerMany: (handlers) =>
set((s) => ({ handlers: { ...s.handlers, ...handlers } })),
register: (id, handler) => set((s) => ({ handlers: { ...s.handlers, [id]: handler } })),
registerMany: (handlers) => set((s) => ({ handlers: { ...s.handlers, ...handlers } })),
unregister: (id) =>
set((s) => {
const next = { ...s.handlers };
src/renderer/stores/file-store.ts
+205 -203
View File
@@ -73,226 +73,228 @@ function updateNode(tree: FileNode, dirPath: string, updater: (node: FileNode) =
export const useFileStore = create<FileState>()(
persist(
immer((set) => ({
tree: null,
rootPath: null,
expanded: new Set<string>(),
openTabs: [],
activeTabId: null,
tree: null,
rootPath: null,
expanded: new Set<string>(),
openTabs: [],
activeTabId: null,
openFolder: async (path) => {
const result = await ipc.file.list(path);
if (!result.ok) {
toast.error(`Failed to open folder: ${result.error.message}`);
return;
}
const raw: any = result.data!;
const entries: any[] = Array.isArray(raw) ? raw : raw.entries;
const children: FileNode[] = entries.map(entryToNode);
set((s) => {
s.tree = {
name: path.split('/').filter(Boolean).pop() ?? path,
path,
isDirectory: true,
children,
loaded: true,
};
s.rootPath = path;
});
},
loadChildren: async (dirPath) => {
// Find the node first
const tree = useFileStore.getState().tree;
if (!tree) return;
let found = false;
updateNode(tree, dirPath, (node) => {
if (node.loaded === true) return;
found = true;
});
if (!found) return;
const result = await ipc.file.list(dirPath);
if (!result.ok) return;
set((s) => {
updateNode(s.tree!, dirPath, (node) => {
const raw: any = result.data!;
const items: any[] = Array.isArray(raw) ? raw : raw.entries;
node.children = items.map(entryToNode);
node.loaded = true;
});
});
},
toggleExpanded: (dirPath) => {
set((s) => {
if (s.expanded.has(dirPath)) {
s.expanded.delete(dirPath);
} else {
s.expanded.add(dirPath);
openFolder: async (path) => {
const result = await ipc.file.list(path);
if (!result.ok) {
toast.error(`Failed to open folder: ${result.error.message}`);
return;
}
});
},
openFile: async (filePath) => {
// If already open, sync dirty flag from editor buffer and activate
const existing = useFileStore.getState().openTabs.find((t) => t.id === filePath);
if (existing) {
const buffer = useEditorStore.getState().buffers.get(filePath);
const raw: any = result.data!;
const entries: any[] = Array.isArray(raw) ? raw : raw.entries;
const children: FileNode[] = entries.map(entryToNode);
set((s) => {
s.activeTabId = filePath;
if (buffer) {
const tab = s.openTabs.find((t) => t.id === filePath);
if (tab) tab.dirty = buffer.dirty;
s.tree = {
name: path.split('/').filter(Boolean).pop() ?? path,
path,
isDirectory: true,
children,
loaded: true,
};
s.rootPath = path;
});
},
loadChildren: async (dirPath) => {
// Find the node first
const tree = useFileStore.getState().tree;
if (!tree) return;
let found = false;
updateNode(tree, dirPath, (node) => {
if (node.loaded === true) return;
found = true;
});
if (!found) return;
const result = await ipc.file.list(dirPath);
if (!result.ok) return;
set((s) => {
updateNode(s.tree!, dirPath, (node) => {
const raw: any = result.data!;
const items: any[] = Array.isArray(raw) ? raw : raw.entries;
node.children = items.map(entryToNode);
node.loaded = true;
});
});
},
toggleExpanded: (dirPath) => {
set((s) => {
if (s.expanded.has(dirPath)) {
s.expanded.delete(dirPath);
} else {
s.expanded.add(dirPath);
}
});
return;
}
},
const result = await ipc.file.read(filePath);
if (!result.ok) {
toast.error(`Failed to open file: ${result.error.message}`);
return;
}
const content = result.data!;
const title = filePath.split('/').pop() ?? filePath;
// Open in editor store
useEditorStore.getState().openBuffer(filePath, filePath, content);
set((s) => {
s.openTabs.push({ id: filePath, path: filePath, title, dirty: false });
s.activeTabId = filePath;
});
},
// Used when the main process has already read the file (e.g. file-opened
// IPC from File → Open menu). Skips the renderer-side IPC read since main
// already has the content. Preserves the editor's current buffer content
// if the file is already open.
openFileFromMain: async (filePath, content) => {
const existing = useFileStore.getState().openTabs.find((t) => t.id === filePath);
if (existing) {
set((s) => { s.activeTabId = filePath; });
return;
}
const title = filePath.split('/').pop() ?? filePath;
useEditorStore.getState().openBuffer(filePath, filePath, content);
set((s) => {
s.openTabs.push({ id: filePath, path: filePath, title, dirty: false });
s.activeTabId = filePath;
});
},
closeTab: (id) => {
set((s) => {
const idx = s.openTabs.findIndex((t) => t.id === id);
if (idx === -1) return;
s.openTabs.splice(idx, 1);
if (s.activeTabId === id) {
s.activeTabId = idx > 0 ? s.openTabs[idx - 1]?.id ?? null : null;
openFile: async (filePath) => {
// If already open, sync dirty flag from editor buffer and activate
const existing = useFileStore.getState().openTabs.find((t) => t.id === filePath);
if (existing) {
const buffer = useEditorStore.getState().buffers.get(filePath);
set((s) => {
s.activeTabId = filePath;
if (buffer) {
const tab = s.openTabs.find((t) => t.id === filePath);
if (tab) tab.dirty = buffer.dirty;
}
});
return;
}
});
},
setActiveTab: (id) => {
set((s) => {
s.activeTabId = id;
});
},
const result = await ipc.file.read(filePath);
if (!result.ok) {
toast.error(`Failed to open file: ${result.error.message}`);
return;
}
markTabClean: (id) => {
set((s) => {
const tab = s.openTabs.find((t) => t.id === id);
if (tab) tab.dirty = false;
});
},
const content = result.data!;
const title = filePath.split('/').pop() ?? filePath;
markTabDirty: (id) => {
set((s) => {
const tab = s.openTabs.find((t) => t.id === id);
if (tab) tab.dirty = true;
});
},
// Open in editor store
useEditorStore.getState().openBuffer(filePath, filePath, content);
reorderTabs: (fromIndex, toIndex) => {
set((s) => {
const tabs = s.openTabs;
const [moved] = tabs.splice(fromIndex, 1);
tabs.splice(toIndex, 0, moved);
});
},
openFolderDialog: async () => {
const result = await ipc.file.pickFolder();
if (!result.ok || result.data === null) return;
await useFileStore.getState().openFolder(result.data);
},
openFileDialog: async () => {
const result = await ipc.file.pickFile();
if (!result.ok || result.data === null) return;
await useFileStore.getState().openFile(result.data);
},
saveActiveBuffer: async () => {
const { activeTabId } = useFileStore.getState();
if (!activeTabId) return false;
const buffer = useEditorStore.getState().buffers.get(activeTabId);
if (!buffer) return false;
let savePath = activeTabId;
const isUnsaved = activeTabId.startsWith('untitled-');
if (isUnsaved) {
const dialogResult = await ipc.app.showSaveDialog({
title: 'Save Markdown File',
defaultPath: 'document.md',
filters: [
{ name: 'Markdown', extensions: ['md', 'markdown'] },
{ name: 'All Files', extensions: ['*'] }
]
set((s) => {
s.openTabs.push({ id: filePath, path: filePath, title, dirty: false });
s.activeTabId = filePath;
});
if (!dialogResult.ok || !dialogResult.data) {
},
// Used when the main process has already read the file (e.g. file-opened
// IPC from File → Open menu). Skips the renderer-side IPC read since main
// already has the content. Preserves the editor's current buffer content
// if the file is already open.
openFileFromMain: async (filePath, content) => {
const existing = useFileStore.getState().openTabs.find((t) => t.id === filePath);
if (existing) {
set((s) => {
s.activeTabId = filePath;
});
return;
}
const title = filePath.split('/').pop() ?? filePath;
useEditorStore.getState().openBuffer(filePath, filePath, content);
set((s) => {
s.openTabs.push({ id: filePath, path: filePath, title, dirty: false });
s.activeTabId = filePath;
});
},
closeTab: (id) => {
set((s) => {
const idx = s.openTabs.findIndex((t) => t.id === id);
if (idx === -1) return;
s.openTabs.splice(idx, 1);
if (s.activeTabId === id) {
s.activeTabId = idx > 0 ? (s.openTabs[idx - 1]?.id ?? null) : null;
}
});
},
setActiveTab: (id) => {
set((s) => {
s.activeTabId = id;
});
},
markTabClean: (id) => {
set((s) => {
const tab = s.openTabs.find((t) => t.id === id);
if (tab) tab.dirty = false;
});
},
markTabDirty: (id) => {
set((s) => {
const tab = s.openTabs.find((t) => t.id === id);
if (tab) tab.dirty = true;
});
},
reorderTabs: (fromIndex, toIndex) => {
set((s) => {
const tabs = s.openTabs;
const [moved] = tabs.splice(fromIndex, 1);
tabs.splice(toIndex, 0, moved);
});
},
openFolderDialog: async () => {
const result = await ipc.file.pickFolder();
if (!result.ok || result.data === null) return;
await useFileStore.getState().openFolder(result.data);
},
openFileDialog: async () => {
const result = await ipc.file.pickFile();
if (!result.ok || result.data === null) return;
await useFileStore.getState().openFile(result.data);
},
saveActiveBuffer: async () => {
const { activeTabId } = useFileStore.getState();
if (!activeTabId) return false;
const buffer = useEditorStore.getState().buffers.get(activeTabId);
if (!buffer) return false;
let savePath = activeTabId;
const isUnsaved = activeTabId.startsWith('untitled-');
if (isUnsaved) {
const dialogResult = await ipc.app.showSaveDialog({
title: 'Save Markdown File',
defaultPath: 'document.md',
filters: [
{ name: 'Markdown', extensions: ['md', 'markdown'] },
{ name: 'All Files', extensions: ['*'] },
],
});
if (!dialogResult.ok || !dialogResult.data) {
return false;
}
savePath = dialogResult.data;
}
const writeResult = await ipc.file.write(savePath, buffer.content);
if (!writeResult.ok) {
toast.error(`Failed to save: ${writeResult.error.message}`);
return false;
}
savePath = dialogResult.data;
}
const writeResult = await ipc.file.write(savePath, buffer.content);
if (!writeResult.ok) {
toast.error(`Failed to save: ${writeResult.error.message}`);
return false;
}
if (isUnsaved) {
useEditorStore.getState().renameBuffer(activeTabId, savePath, savePath);
set((s) => {
const tab = s.openTabs.find((t) => t.id === activeTabId);
if (tab) {
tab.id = savePath;
tab.path = savePath;
tab.title = savePath.split('/').pop() ?? savePath;
tab.dirty = false;
}
s.activeTabId = savePath;
});
} else {
useEditorStore.getState().markSaved(activeTabId);
useFileStore.getState().markTabClean(activeTabId);
}
if (isUnsaved) {
useEditorStore.getState().renameBuffer(activeTabId, savePath, savePath);
set((s) => {
const tab = s.openTabs.find((t) => t.id === activeTabId);
if (tab) {
tab.id = savePath;
tab.path = savePath;
tab.title = savePath.split('/').pop() ?? savePath;
tab.dirty = false;
}
s.activeTabId = savePath;
});
} else {
useEditorStore.getState().markSaved(activeTabId);
useFileStore.getState().markTabClean(activeTabId);
}
const title = savePath.split('/').pop() ?? savePath;
toast.success(`Saved ${title}`);
return true;
},
})),
const title = savePath.split('/').pop() ?? savePath;
toast.success(`Saved ${title}`);
return true;
},
})),
{
name: 'mc-file-store',
storage: createJSONStorage(() => localStorage),

Some files were not shown because too many files have changed in this diff Show More