@@ -841,15 +854,12 @@
strokeWidthPt={textBoxUi.strokeWidthPt}
/>
{/if}
- {#if spellMenu.visible}
- (ctxMenu = null)}
/>
{/if}
{#if linkTip}
diff --git a/src/lib/components/SpellContextMenu.svelte b/src/lib/components/SpellContextMenu.svelte
deleted file mode 100644
index 6b74dd7..0000000
--- a/src/lib/components/SpellContextMenu.svelte
+++ /dev/null
@@ -1,114 +0,0 @@
-
-
-
-
-
diff --git a/src/lib/editor/contextMenuItems.ts b/src/lib/editor/contextMenuItems.ts
new file mode 100644
index 0000000..5b3c6ae
--- /dev/null
+++ b/src/lib/editor/contextMenuItems.ts
@@ -0,0 +1,104 @@
+import type { Editor } from '@tiptap/core';
+import { t } from '../i18n/i18n.svelte';
+import { withShortcut } from '../i18n/shortcut';
+import { shortcutHint } from './shortcuts';
+import { OPEN_LINK_DIALOG_EVENT } from './extensions/link';
+
+// The right-click menu's contents, Word's text menu mapped onto this editor. Pure
+// data + closures — ContextMenu.svelte only renders it.
+export type MenuEntry =
+ | { kind: 'sep' }
+ | { kind: 'item'; label: string; hint?: string; disabled?: boolean; strong?: boolean; run: () => void };
+
+export interface SpellSection {
+ suggestions: string[];
+ onReplace: (word: string) => void;
+ onAdd: () => void;
+ onIgnore: () => void;
+}
+
+// Cut/copy go through execCommand so ProseMirror's own copy handler builds the
+// clipboard payload (HTML + its slice metadata) — formatting survives.
+// ponytail: deprecated but the only route to that payload; revisit if a browser drops it.
+function clipboardCommand(editor: Editor, command: 'cut' | 'copy') {
+ editor.view.focus();
+ document.execCommand(command);
+}
+
+async function readClipboard(editor: Editor, plainOnly: boolean) {
+ const view = editor.view;
+ view.focus();
+ try {
+ if (plainOnly) {
+ view.pasteText(await navigator.clipboard.readText());
+ return;
+ }
+ for (const item of await navigator.clipboard.read()) {
+ if (item.types.includes('text/html')) {
+ view.pasteHTML(await (await item.getType('text/html')).text());
+ return;
+ }
+ if (item.types.includes('text/plain')) {
+ view.pasteText(await (await item.getType('text/plain')).text());
+ return;
+ }
+ }
+ } catch {
+ // Firefox/Safari gate clipboard reads behind their own paste affordance.
+ alert(t().contextMenu.pasteBlocked);
+ }
+}
+
+export function buildContextMenu(editor: Editor, opts: { spell?: SpellSection } = {}): MenuEntry[] {
+ const m = t().contextMenu;
+ const entries: MenuEntry[] = [];
+
+ if (opts.spell) {
+ const { suggestions, onReplace, onAdd, onIgnore } = opts.spell;
+ if (suggestions.length) {
+ for (const s of suggestions) entries.push({ kind: 'item', label: s, strong: true, run: () => onReplace(s) });
+ } else {
+ entries.push({ kind: 'item', label: t().spell.noSuggestions, disabled: true, run: () => {} });
+ }
+ entries.push({ kind: 'sep' });
+ entries.push({ kind: 'item', label: t().spell.ignoreAll, run: onIgnore });
+ entries.push({ kind: 'item', label: t().spell.addToDictionary, run: onAdd });
+ entries.push({ kind: 'sep' });
+ }
+
+ const hasSelection = !editor.state.selection.empty;
+ entries.push(
+ { kind: 'item', label: m.cut, hint: withShortcut('Ctrl+X'), disabled: !hasSelection, run: () => clipboardCommand(editor, 'cut') },
+ { kind: 'item', label: m.copy, hint: withShortcut('Ctrl+C'), disabled: !hasSelection, run: () => clipboardCommand(editor, 'copy') },
+ { kind: 'item', label: m.paste, hint: withShortcut('Ctrl+V'), run: () => void readClipboard(editor, false) },
+ { kind: 'item', label: m.pasteWithoutFormatting, hint: withShortcut('Ctrl+Shift+V'), run: () => void readClipboard(editor, true) },
+ { kind: 'sep' },
+ );
+
+ const onLink = editor.isActive('link');
+ entries.push({
+ kind: 'item',
+ label: onLink ? m.editLink : m.insertLink,
+ hint: shortcutHint('link'),
+ run: () => window.dispatchEvent(new CustomEvent(OPEN_LINK_DIALOG_EVENT)),
+ });
+ if (onLink) {
+ entries.push({
+ kind: 'item',
+ label: m.removeLink,
+ run: () => editor.chain().focus().extendMarkRange('link').unsetLink().run(),
+ });
+ }
+
+ entries.push(
+ { kind: 'sep' },
+ {
+ kind: 'item',
+ label: m.clearFormatting,
+ hint: shortcutHint('clearFormatting'),
+ run: () => editor.commands.clearDirectFormatting(),
+ },
+ );
+
+ return entries;
+}
diff --git a/src/lib/i18n/locales/de.ts b/src/lib/i18n/locales/de.ts
index 55022f6..a9b1647 100644
--- a/src/lib/i18n/locales/de.ts
+++ b/src/lib/i18n/locales/de.ts
@@ -275,6 +275,17 @@ const de: Messages = {
addToDictionary: 'Zum Wörterbuch hinzufügen',
ignoreAll: 'Alle ignorieren',
},
+ contextMenu: {
+ cut: 'Ausschneiden',
+ copy: 'Kopieren',
+ paste: 'Einfügen',
+ pasteWithoutFormatting: 'Ohne Formatierung einfügen',
+ pasteBlocked: 'Dieser Browser erlaubt das Einfügen nur über die Tastatur. Drücke Strg+V oder halte beim Rechtsklick die Umschalttaste, um das Browser-Menü zu nutzen.',
+ insertLink: 'Link…',
+ editLink: 'Link bearbeiten…',
+ removeLink: 'Link entfernen',
+ clearFormatting: 'Direkte Formatierung löschen',
+ },
about: {
label: 'Über EdenText',
tagline: 'Ein privater Editor für OpenDocument-Dateien — läuft vollständig im Browser.',
diff --git a/src/lib/i18n/locales/en.ts b/src/lib/i18n/locales/en.ts
index a0273f6..6d942f8 100644
--- a/src/lib/i18n/locales/en.ts
+++ b/src/lib/i18n/locales/en.ts
@@ -279,6 +279,17 @@ const en = {
addToDictionary: 'Add to Dictionary',
ignoreAll: 'Ignore All',
},
+ contextMenu: {
+ cut: 'Cut',
+ copy: 'Copy',
+ paste: 'Paste',
+ pasteWithoutFormatting: 'Paste without formatting',
+ pasteBlocked: 'This browser only allows pasting from the keyboard. Press Ctrl+V, or hold Shift while right-clicking to use the browser menu.',
+ insertLink: 'Link…',
+ editLink: 'Edit Link…',
+ removeLink: 'Remove Link',
+ clearFormatting: 'Clear Formatting',
+ },
about: {
label: 'About EdenText',
tagline: 'A private editor for OpenDocument files — runs entirely in your browser.',
diff --git a/tests/unit/context-menu.test.ts b/tests/unit/context-menu.test.ts
new file mode 100644
index 0000000..7521a2a
--- /dev/null
+++ b/tests/unit/context-menu.test.ts
@@ -0,0 +1,76 @@
+// The right-click menu's contents (Word's text menu). Drives a real body editor so the
+// entries are built against a live selection, exactly as Editor.svelte does.
+import { describe, it, expect } from 'vitest';
+import { Editor } from '@tiptap/core';
+import { extensions } from '../../src/lib/editor/extensions';
+import { buildContextMenu, type MenuEntry } from '../../src/lib/editor/contextMenuItems';
+
+type N = any;
+
+function makeEditor(content: N) {
+ const el = document.createElement('div');
+ document.body.appendChild(el);
+ return new Editor({ element: el, extensions, content });
+}
+
+const para = (text: string, marks?: N[]): N => ({
+ type: 'doc',
+ content: [{ type: 'paragraph', content: [{ type: 'text', text, ...(marks ? { marks } : {}) }] }],
+});
+
+const labels = (entries: MenuEntry[]) =>
+ entries.filter((e): e is Extract => e.kind === 'item').map((e) => e.label);
+
+const item = (entries: MenuEntry[], label: string) =>
+ entries.find((e): e is Extract => e.kind === 'item' && e.label === label);
+
+describe('context menu items', () => {
+ it('disables cut/copy without a selection and enables them with one', () => {
+ const editor = makeEditor(para('Hello world'));
+ editor.commands.setTextSelection(3);
+ expect(item(buildContextMenu(editor), 'Cut')!.disabled).toBe(true);
+ expect(item(buildContextMenu(editor), 'Copy')!.disabled).toBe(true);
+
+ editor.commands.setTextSelection({ from: 1, to: 6 });
+ expect(item(buildContextMenu(editor), 'Cut')!.disabled).toBe(false);
+ expect(item(buildContextMenu(editor), 'Copy')!.disabled).toBe(false);
+ editor.destroy();
+ });
+
+ it('shows spelling suggestions in the first section, above the clipboard', () => {
+ const editor = makeEditor(para('Helo'));
+ const plain = buildContextMenu(editor);
+ expect(labels(plain)).not.toContain('Hello');
+
+ const withSpell = buildContextMenu(editor, {
+ spell: { suggestions: ['Hello', 'Halo'], onReplace: () => {}, onAdd: () => {}, onIgnore: () => {} },
+ });
+ const names = labels(withSpell);
+ expect(names.slice(0, 2)).toEqual(['Hello', 'Halo']);
+ expect(names.indexOf('Ignore All')).toBeLessThan(names.indexOf('Cut'));
+ editor.destroy();
+ });
+
+ it('offers edit/remove only when the cursor sits in a link', () => {
+ const editor = makeEditor(para('Hello'));
+ expect(labels(buildContextMenu(editor))).toContain('Link…');
+ expect(labels(buildContextMenu(editor))).not.toContain('Remove Link');
+
+ const linked = makeEditor(para('Hello', [{ type: 'link', attrs: { href: 'https://example.com' } }]));
+ linked.commands.setTextSelection(3);
+ const names = labels(buildContextMenu(linked));
+ expect(names).toContain('Edit Link…');
+ expect(names).toContain('Remove Link');
+ editor.destroy();
+ linked.destroy();
+ });
+
+ it('clears direct formatting through its entry', () => {
+ const editor = makeEditor(para('Hello'));
+ editor.commands.setTextSelection({ from: 1, to: 6 });
+ editor.commands.setFontSize('20pt');
+ item(buildContextMenu(editor), 'Clear Formatting')!.run();
+ expect(JSON.stringify(editor.getJSON())).not.toContain('20pt');
+ editor.destroy();
+ });
+});