From a1d5719fe06d41b3c8b480b0bcbd94c22e4c528d Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 09:17:35 +0300
Subject: [PATCH 01/14] feat(ckeditor5): create an empty toolbar for code
 blocks

---
 packages/ckeditor5/src/plugins.ts             |  4 +-
 .../src/plugins/code_block_toolbar.ts         | 45 +++++++++++++++++++
 2 files changed, 48 insertions(+), 1 deletion(-)
 create mode 100644 packages/ckeditor5/src/plugins/code_block_toolbar.ts

diff --git a/packages/ckeditor5/src/plugins.ts b/packages/ckeditor5/src/plugins.ts
index 19fbc748e..c53dfb924 100644
--- a/packages/ckeditor5/src/plugins.ts
+++ b/packages/ckeditor5/src/plugins.ts
@@ -23,6 +23,7 @@ import "@triliumnext/ckeditor5-mermaid/index.css";
 import "@triliumnext/ckeditor5-admonition/index.css";
 import "@triliumnext/ckeditor5-footnotes/index.css";
 import "@triliumnext/ckeditor5-math/index.css";
+import CodeBlockToolbar from "./plugins/code_block_toolbar.js";
 
 /**
  * Plugins that are specific to Trilium and not part of the CKEditor 5 core, included in both text editors but not in the attribute editor.
@@ -38,7 +39,8 @@ const TRILIUM_PLUGINS: typeof Plugin[] = [
     MarkdownImportPlugin,
     IncludeNote,
     Uploadfileplugin,
-    SyntaxHighlighting
+    SyntaxHighlighting,
+    CodeBlockToolbar
 ];
 
 /**
diff --git a/packages/ckeditor5/src/plugins/code_block_toolbar.ts b/packages/ckeditor5/src/plugins/code_block_toolbar.ts
new file mode 100644
index 000000000..58e322381
--- /dev/null
+++ b/packages/ckeditor5/src/plugins/code_block_toolbar.ts
@@ -0,0 +1,45 @@
+import { CodeBlock, Plugin, Position, ViewDocumentFragment, WidgetToolbarRepository, type Node, type ViewNode } from "ckeditor5";
+
+export default class CodeBlockToolbar extends Plugin {
+
+    static get requires() {
+        return [ WidgetToolbarRepository, CodeBlock ] as const;
+    }
+
+    afterInit() {
+        const editor = this.editor;
+        const widgetToolbarRepository = editor.plugins.get(WidgetToolbarRepository);
+
+        widgetToolbarRepository.register("codeblock", {
+            items: [
+                {
+                    label: "Hello",
+                    items: [
+                        {
+                            label: "world",
+                            items: []
+                        }
+                    ]
+                }
+            ],
+            getRelatedElement(selection) {
+                const selectionPosition = selection.getFirstPosition();
+                if (!selectionPosition) {
+                    return null;
+                }
+
+                let parent: ViewNode | ViewDocumentFragment | null = selectionPosition.parent;
+                while (parent) {
+                    if (parent.is("element", "pre")) {
+                        return parent;
+                    }
+
+                    parent = parent.parent;
+                }
+
+                return null;
+            }
+        });
+    }
+
+}

From 178ce310643ee122991bf8dcfb66a27a3fd1f86a Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 10:07:52 +0300
Subject: [PATCH 02/14] feat(ckeditor5/codeblock): add language dropdown

---
 .../src/plugins/code_block_toolbar.ts         | 103 ++++++++++++++++--
 1 file changed, 93 insertions(+), 10 deletions(-)

diff --git a/packages/ckeditor5/src/plugins/code_block_toolbar.ts b/packages/ckeditor5/src/plugins/code_block_toolbar.ts
index 58e322381..259f98bc4 100644
--- a/packages/ckeditor5/src/plugins/code_block_toolbar.ts
+++ b/packages/ckeditor5/src/plugins/code_block_toolbar.ts
@@ -1,4 +1,4 @@
-import { CodeBlock, Plugin, Position, ViewDocumentFragment, WidgetToolbarRepository, type Node, type ViewNode } from "ckeditor5";
+import { Editor, CodeBlock, Plugin, ViewDocumentFragment, WidgetToolbarRepository, type ViewNode, type ListDropdownButtonDefinition, Collection, type CodeBlockCommand, ViewModel, createDropdown, addListToDropdown, DropdownButtonView } from "ckeditor5";
 
 export default class CodeBlockToolbar extends Plugin {
 
@@ -6,21 +6,44 @@ export default class CodeBlockToolbar extends Plugin {
         return [ WidgetToolbarRepository, CodeBlock ] as const;
     }
 
+    public init(): void {
+        const editor = this.editor;
+        const componentFactory = editor.ui.componentFactory;
+
+        const normalizedLanguageDefs = this._getNormalizedAndLocalizedLanguageDefinitions(editor);
+		const itemDefinitions = this._getLanguageListItemDefinitions(normalizedLanguageDefs);
+        const command: CodeBlockCommand = editor.commands.get( 'codeBlock' )!;
+
+        componentFactory.add("codeBlockDropdown", locale => {
+            const dropdownView = createDropdown(this.editor.locale, DropdownButtonView);
+            dropdownView.buttonView.set({
+                withText: true
+            });
+            dropdownView.bind( 'isEnabled' ).to( command, 'value', value => !!value );
+            dropdownView.buttonView.bind( 'label' ).to( command, 'value', (value) => {
+                const itemDefinition = normalizedLanguageDefs.find((def) => def.language === value);
+                return itemDefinition?.label;
+            });
+            dropdownView.on( 'execute', evt => {
+				editor.execute( 'codeBlock', {
+					language: ( evt.source as any )._codeBlockLanguage,
+					forceValue: true
+				});
+
+				editor.editing.view.focus();
+			});
+            addListToDropdown(dropdownView, itemDefinitions);
+            return dropdownView;
+        });
+    }
+
     afterInit() {
         const editor = this.editor;
         const widgetToolbarRepository = editor.plugins.get(WidgetToolbarRepository);
 
         widgetToolbarRepository.register("codeblock", {
             items: [
-                {
-                    label: "Hello",
-                    items: [
-                        {
-                            label: "world",
-                            items: []
-                        }
-                    ]
-                }
+                "codeBlockDropdown"
             ],
             getRelatedElement(selection) {
                 const selectionPosition = selection.getFirstPosition();
@@ -42,4 +65,64 @@ export default class CodeBlockToolbar extends Plugin {
         });
     }
 
+    // Adapted from packages/ckeditor5-code-block/src/codeblockui.ts
+    private _getLanguageListItemDefinitions(
+		normalizedLanguageDefs: Array<CodeBlockLanguageDefinition>
+	): Collection<ListDropdownButtonDefinition> {
+		const editor = this.editor;
+		const command: CodeBlockCommand = editor.commands.get( 'codeBlock' )!;
+		const itemDefinitions = new Collection<ListDropdownButtonDefinition>();
+
+		for ( const languageDef of normalizedLanguageDefs ) {
+			const definition: ListDropdownButtonDefinition = {
+				type: 'button',
+				model: new ViewModel( {
+					_codeBlockLanguage: languageDef.language,
+					label: languageDef.label,
+					role: 'menuitemradio',
+					withText: true
+				} )
+			};
+
+			definition.model.bind( 'isOn' ).to( command, 'value', value => {
+				return value === definition.model._codeBlockLanguage;
+			} );
+
+			itemDefinitions.add( definition );
+		}
+
+		return itemDefinitions;
+	}
+
+    // Adapted from packages/ckeditor5-code-block/src/utils.ts
+    private _getNormalizedAndLocalizedLanguageDefinitions(editor: Editor) {
+        const languageDefs = editor.config.get( 'codeBlock.languages' ) as Array<CodeBlockLanguageDefinition>;
+        for ( const def of languageDefs ) {
+            if ( def.class === undefined ) {
+                def.class = `language-${ def.language }`;
+            }
+        }
+        return languageDefs;
+    }
+
+}
+
+interface CodeBlockLanguageDefinition {
+
+	/**
+	 * The name of the language that will be stored in the model attribute. Also, when `class`
+	 * is not specified, it will be used to create the CSS class associated with the language (prefixed by "language-").
+	 */
+	language: string;
+
+	/**
+	 * The human–readable label associated with the language and displayed in the UI.
+	 */
+	label: string;
+
+	/**
+	 * The CSS class associated with the language. When not specified the `language`
+ 	 * property is used to create a class prefixed by "language-".
+	 */
+	class?: string;
 }

From 751ed0b5d4706faeae53efb9c647f7571e3b3e2b Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 10:53:12 +0300
Subject: [PATCH 03/14] refactor(ckeditor5/codeblock): split dropdown into own
 plugin

---
 packages/ckeditor5/src/plugins.ts             |   2 +
 .../plugins/code_block_language_dropdown.ts   | 103 ++++++++++++++++++
 .../src/plugins/code_block_toolbar.ts         |  96 +---------------
 3 files changed, 108 insertions(+), 93 deletions(-)
 create mode 100644 packages/ckeditor5/src/plugins/code_block_language_dropdown.ts

diff --git a/packages/ckeditor5/src/plugins.ts b/packages/ckeditor5/src/plugins.ts
index c53dfb924..29abde14c 100644
--- a/packages/ckeditor5/src/plugins.ts
+++ b/packages/ckeditor5/src/plugins.ts
@@ -24,6 +24,7 @@ import "@triliumnext/ckeditor5-admonition/index.css";
 import "@triliumnext/ckeditor5-footnotes/index.css";
 import "@triliumnext/ckeditor5-math/index.css";
 import CodeBlockToolbar from "./plugins/code_block_toolbar.js";
+import CodeBlockLanguageDropdown from "./plugins/code_block_language_dropdown.js";
 
 /**
  * Plugins that are specific to Trilium and not part of the CKEditor 5 core, included in both text editors but not in the attribute editor.
@@ -40,6 +41,7 @@ const TRILIUM_PLUGINS: typeof Plugin[] = [
     IncludeNote,
     Uploadfileplugin,
     SyntaxHighlighting,
+    CodeBlockLanguageDropdown,
     CodeBlockToolbar
 ];
 
diff --git a/packages/ckeditor5/src/plugins/code_block_language_dropdown.ts b/packages/ckeditor5/src/plugins/code_block_language_dropdown.ts
new file mode 100644
index 000000000..7b384a784
--- /dev/null
+++ b/packages/ckeditor5/src/plugins/code_block_language_dropdown.ts
@@ -0,0 +1,103 @@
+import { Editor, CodeBlock, Plugin, type ListDropdownButtonDefinition, Collection, type CodeBlockCommand, ViewModel, createDropdown, addListToDropdown, DropdownButtonView } from "ckeditor5";
+
+/**
+ * Toolbar item which displays the list of languages in a dropdown, with the text visible (similar to the headings switcher), as opposed to the default split button implementation.
+ */
+export default class CodeBlockLanguageDropdown extends Plugin {
+
+    static get requires() {
+        return [ CodeBlock ];
+    }
+
+    public init() {
+        const editor = this.editor;
+        const componentFactory = editor.ui.componentFactory;
+
+        const normalizedLanguageDefs = this._getNormalizedAndLocalizedLanguageDefinitions(editor);
+        const itemDefinitions = this._getLanguageListItemDefinitions(normalizedLanguageDefs);
+        const command: CodeBlockCommand = editor.commands.get( 'codeBlock' )!;
+
+        componentFactory.add("codeBlockDropdown", locale => {
+            const dropdownView = createDropdown(this.editor.locale, DropdownButtonView);
+            dropdownView.buttonView.set({
+                withText: true
+            });
+            dropdownView.bind( 'isEnabled' ).to( command, 'value', value => !!value );
+            dropdownView.buttonView.bind( 'label' ).to( command, 'value', (value) => {
+                const itemDefinition = normalizedLanguageDefs.find((def) => def.language === value);
+                return itemDefinition?.label;
+            });
+            dropdownView.on( 'execute', evt => {
+                editor.execute( 'codeBlock', {
+                    language: ( evt.source as any )._codeBlockLanguage,
+                    forceValue: true
+                });
+
+                editor.editing.view.focus();
+            });
+            addListToDropdown(dropdownView, itemDefinitions);
+            return dropdownView;
+        });
+    }
+
+    // Adapted from packages/ckeditor5-code-block/src/codeblockui.ts
+    private _getLanguageListItemDefinitions(
+		normalizedLanguageDefs: Array<CodeBlockLanguageDefinition>
+	): Collection<ListDropdownButtonDefinition> {
+		const editor = this.editor;
+		const command: CodeBlockCommand = editor.commands.get( 'codeBlock' )!;
+		const itemDefinitions = new Collection<ListDropdownButtonDefinition>();
+
+		for ( const languageDef of normalizedLanguageDefs ) {
+			const definition: ListDropdownButtonDefinition = {
+				type: 'button',
+				model: new ViewModel( {
+					_codeBlockLanguage: languageDef.language,
+					label: languageDef.label,
+					role: 'menuitemradio',
+					withText: true
+				} )
+			};
+
+			definition.model.bind( 'isOn' ).to( command, 'value', value => {
+				return value === definition.model._codeBlockLanguage;
+			} );
+
+			itemDefinitions.add( definition );
+		}
+
+		return itemDefinitions;
+	}
+
+    // Adapted from packages/ckeditor5-code-block/src/utils.ts
+    private _getNormalizedAndLocalizedLanguageDefinitions(editor: Editor) {
+        const languageDefs = editor.config.get( 'codeBlock.languages' ) as Array<CodeBlockLanguageDefinition>;
+        for ( const def of languageDefs ) {
+            if ( def.class === undefined ) {
+                def.class = `language-${ def.language }`;
+            }
+        }
+        return languageDefs;
+    }
+
+}
+
+interface CodeBlockLanguageDefinition {
+
+	/**
+	 * The name of the language that will be stored in the model attribute. Also, when `class`
+	 * is not specified, it will be used to create the CSS class associated with the language (prefixed by "language-").
+	 */
+	language: string;
+
+	/**
+	 * The human–readable label associated with the language and displayed in the UI.
+	 */
+	label: string;
+
+	/**
+	 * The CSS class associated with the language. When not specified the `language`
+ 	 * property is used to create a class prefixed by "language-".
+	 */
+	class?: string;
+}
diff --git a/packages/ckeditor5/src/plugins/code_block_toolbar.ts b/packages/ckeditor5/src/plugins/code_block_toolbar.ts
index 259f98bc4..8e4e1081a 100644
--- a/packages/ckeditor5/src/plugins/code_block_toolbar.ts
+++ b/packages/ckeditor5/src/plugins/code_block_toolbar.ts
@@ -1,40 +1,10 @@
-import { Editor, CodeBlock, Plugin, ViewDocumentFragment, WidgetToolbarRepository, type ViewNode, type ListDropdownButtonDefinition, Collection, type CodeBlockCommand, ViewModel, createDropdown, addListToDropdown, DropdownButtonView } from "ckeditor5";
+import { CodeBlock, Plugin, ViewDocumentFragment, WidgetToolbarRepository, type ViewNode } from "ckeditor5";
+import CodeBlockLanguageDropdown from "./code_block_language_dropdown";
 
 export default class CodeBlockToolbar extends Plugin {
 
     static get requires() {
-        return [ WidgetToolbarRepository, CodeBlock ] as const;
-    }
-
-    public init(): void {
-        const editor = this.editor;
-        const componentFactory = editor.ui.componentFactory;
-
-        const normalizedLanguageDefs = this._getNormalizedAndLocalizedLanguageDefinitions(editor);
-		const itemDefinitions = this._getLanguageListItemDefinitions(normalizedLanguageDefs);
-        const command: CodeBlockCommand = editor.commands.get( 'codeBlock' )!;
-
-        componentFactory.add("codeBlockDropdown", locale => {
-            const dropdownView = createDropdown(this.editor.locale, DropdownButtonView);
-            dropdownView.buttonView.set({
-                withText: true
-            });
-            dropdownView.bind( 'isEnabled' ).to( command, 'value', value => !!value );
-            dropdownView.buttonView.bind( 'label' ).to( command, 'value', (value) => {
-                const itemDefinition = normalizedLanguageDefs.find((def) => def.language === value);
-                return itemDefinition?.label;
-            });
-            dropdownView.on( 'execute', evt => {
-				editor.execute( 'codeBlock', {
-					language: ( evt.source as any )._codeBlockLanguage,
-					forceValue: true
-				});
-
-				editor.editing.view.focus();
-			});
-            addListToDropdown(dropdownView, itemDefinitions);
-            return dropdownView;
-        });
+        return [ WidgetToolbarRepository, CodeBlock, CodeBlockLanguageDropdown ] as const;
     }
 
     afterInit() {
@@ -65,64 +35,4 @@ export default class CodeBlockToolbar extends Plugin {
         });
     }
 
-    // Adapted from packages/ckeditor5-code-block/src/codeblockui.ts
-    private _getLanguageListItemDefinitions(
-		normalizedLanguageDefs: Array<CodeBlockLanguageDefinition>
-	): Collection<ListDropdownButtonDefinition> {
-		const editor = this.editor;
-		const command: CodeBlockCommand = editor.commands.get( 'codeBlock' )!;
-		const itemDefinitions = new Collection<ListDropdownButtonDefinition>();
-
-		for ( const languageDef of normalizedLanguageDefs ) {
-			const definition: ListDropdownButtonDefinition = {
-				type: 'button',
-				model: new ViewModel( {
-					_codeBlockLanguage: languageDef.language,
-					label: languageDef.label,
-					role: 'menuitemradio',
-					withText: true
-				} )
-			};
-
-			definition.model.bind( 'isOn' ).to( command, 'value', value => {
-				return value === definition.model._codeBlockLanguage;
-			} );
-
-			itemDefinitions.add( definition );
-		}
-
-		return itemDefinitions;
-	}
-
-    // Adapted from packages/ckeditor5-code-block/src/utils.ts
-    private _getNormalizedAndLocalizedLanguageDefinitions(editor: Editor) {
-        const languageDefs = editor.config.get( 'codeBlock.languages' ) as Array<CodeBlockLanguageDefinition>;
-        for ( const def of languageDefs ) {
-            if ( def.class === undefined ) {
-                def.class = `language-${ def.language }`;
-            }
-        }
-        return languageDefs;
-    }
-
-}
-
-interface CodeBlockLanguageDefinition {
-
-	/**
-	 * The name of the language that will be stored in the model attribute. Also, when `class`
-	 * is not specified, it will be used to create the CSS class associated with the language (prefixed by "language-").
-	 */
-	language: string;
-
-	/**
-	 * The human–readable label associated with the language and displayed in the UI.
-	 */
-	label: string;
-
-	/**
-	 * The CSS class associated with the language. When not specified the `language`
- 	 * property is used to create a class prefixed by "language-".
-	 */
-	class?: string;
 }

From 5eecea52bf42c1434fe0a739c2f1f05cbef591c0 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 11:37:26 +0300
Subject: [PATCH 04/14] feat(ckeditor5/codeblock): add copy icon

---
 packages/ckeditor5/src/icons/copy.svg         |  1 +
 .../src/plugins/code_block_toolbar.ts         |  7 +++++--
 .../src/plugins/copy_to_clipboard_button.ts   | 21 +++++++++++++++++++
 3 files changed, 27 insertions(+), 2 deletions(-)
 create mode 100644 packages/ckeditor5/src/icons/copy.svg
 create mode 100644 packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts

diff --git a/packages/ckeditor5/src/icons/copy.svg b/packages/ckeditor5/src/icons/copy.svg
new file mode 100644
index 000000000..41710638b
--- /dev/null
+++ b/packages/ckeditor5/src/icons/copy.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" style="fill: rgba(0, 0, 0, 1);transform: ;msFilter:;"><path d="M20 2H10c-1.103 0-2 .897-2 2v4H4c-1.103 0-2 .897-2 2v10c0 1.103.897 2 2 2h10c1.103 0 2-.897 2-2v-4h4c1.103 0 2-.897 2-2V4c0-1.103-.897-2-2-2zM4 20V10h10l.002 10H4zm16-6h-4v-4c0-1.103-.897-2-2-2h-4V4h10v10z"></path></svg>
\ No newline at end of file
diff --git a/packages/ckeditor5/src/plugins/code_block_toolbar.ts b/packages/ckeditor5/src/plugins/code_block_toolbar.ts
index 8e4e1081a..4f886efa8 100644
--- a/packages/ckeditor5/src/plugins/code_block_toolbar.ts
+++ b/packages/ckeditor5/src/plugins/code_block_toolbar.ts
@@ -1,10 +1,11 @@
 import { CodeBlock, Plugin, ViewDocumentFragment, WidgetToolbarRepository, type ViewNode } from "ckeditor5";
 import CodeBlockLanguageDropdown from "./code_block_language_dropdown";
+import CopyToClipboardButton from "./copy_to_clipboard_button";
 
 export default class CodeBlockToolbar extends Plugin {
 
     static get requires() {
-        return [ WidgetToolbarRepository, CodeBlock, CodeBlockLanguageDropdown ] as const;
+        return [ WidgetToolbarRepository, CodeBlock, CodeBlockLanguageDropdown, CopyToClipboardButton ] as const;
     }
 
     afterInit() {
@@ -13,7 +14,9 @@ export default class CodeBlockToolbar extends Plugin {
 
         widgetToolbarRepository.register("codeblock", {
             items: [
-                "codeBlockDropdown"
+                "codeBlockDropdown",
+                "|",
+                "copyToClipboard"
             ],
             getRelatedElement(selection) {
                 const selectionPosition = selection.getFirstPosition();
diff --git a/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts b/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts
new file mode 100644
index 000000000..2b67ea820
--- /dev/null
+++ b/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts
@@ -0,0 +1,21 @@
+import { ButtonView, Plugin } from "ckeditor5";
+import copyIcon from "../icons/copy.svg?raw";
+
+export default class CopyToClipboardButton extends Plugin {
+
+    public init() {
+        const editor = this.editor;
+        const componentFactory = editor.ui.componentFactory;
+
+        componentFactory.add("copyToClipboard", locale => {
+            const button = new ButtonView(locale);
+            button.set({
+                tooltip: "Copy to clipboard",
+                icon: copyIcon
+            });
+
+            return button;
+        });
+    }
+
+}

From fc83f67d7cc090b479035a225f82387263d3381b Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 11:37:44 +0300
Subject: [PATCH 05/14] chore(ckeditor5/codeblock): add command for copying to
 clipboard

---
 .../src/plugins/copy_to_clipboard_button.ts   | 30 ++++++++++++++++++-
 1 file changed, 29 insertions(+), 1 deletion(-)

diff --git a/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts b/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts
index 2b67ea820..1de7e6f0e 100644
--- a/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts
+++ b/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts
@@ -1,8 +1,16 @@
-import { ButtonView, Plugin } from "ckeditor5";
+import { ButtonView, Command, Plugin } from "ckeditor5";
 import copyIcon from "../icons/copy.svg?raw";
 
 export default class CopyToClipboardButton extends Plugin {
 
+    static get requires() {
+        return [ CopyToClipboardEditing, CopyToClipboardUI ];
+    }
+
+}
+
+export class CopyToClipboardUI extends Plugin {
+
     public init() {
         const editor = this.editor;
         const componentFactory = editor.ui.componentFactory;
@@ -14,8 +22,28 @@ export default class CopyToClipboardButton extends Plugin {
                 icon: copyIcon
             });
 
+            this.listenTo(button, "execute", () => {
+                editor.execute("copyToClipboard");
+            });
+
             return button;
         });
     }
 
 }
+
+export class CopyToClipboardEditing extends Plugin {
+
+    public init() {
+        this.editor.commands.add("copyToClipboard", new CopyToClipboardCommand(this.editor));
+    }
+
+}
+
+export class CopyToClipboardCommand extends Command {
+
+    execute(...args: Array<unknown>) {
+        console.log("Copy to clipboard!");
+    }
+
+}

From a77d89f4c7259a0b2049e649870c46703fd99776 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 12:18:21 +0300
Subject: [PATCH 06/14] feat(ckeditor5/codeblock): implement copy to clipboard
 function

---
 .../src/plugins/copy_to_clipboard_button.ts   | 24 ++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

diff --git a/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts b/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts
index 1de7e6f0e..d212c1e49 100644
--- a/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts
+++ b/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts
@@ -43,7 +43,29 @@ export class CopyToClipboardEditing extends Plugin {
 export class CopyToClipboardCommand extends Command {
 
     execute(...args: Array<unknown>) {
-        console.log("Copy to clipboard!");
+        const editor = this.editor;
+        const model = editor.model;
+        const selection = model.document.selection;
+
+        const codeBlockEl = selection.getFirstPosition()?.findAncestor("codeBlock");
+        if (!codeBlockEl) {
+            console.warn("Unable to find code block element to copy from.");
+            return;
+        }
+
+        const codeText = Array.from(codeBlockEl.getChildren())
+            .map(child => "data" in child ? child.data : "\n")
+            .join("");
+
+        if (codeText) {
+            navigator.clipboard.writeText(codeText).then(() => {
+                console.log('Code block copied to clipboard');
+            }).catch(err => {
+                console.error('Failed to copy code block', err);
+            });
+        } else {
+            console.warn('No code block selected or found.');
+        }
     }
 
 }

From 622d026efc9f3e5e7f5ef5b23b2c8bc9f56bfc94 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 12:23:11 +0300
Subject: [PATCH 07/14] refactor(ckeditor5/codeblock): simplify copy clipboard
 plugin

---
 .../src/plugins/copy_to_clipboard_button.ts   | 19 ++-----------------
 1 file changed, 2 insertions(+), 17 deletions(-)

diff --git a/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts b/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts
index d212c1e49..281259c17 100644
--- a/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts
+++ b/packages/ckeditor5/src/plugins/copy_to_clipboard_button.ts
@@ -3,18 +3,11 @@ import copyIcon from "../icons/copy.svg?raw";
 
 export default class CopyToClipboardButton extends Plugin {
 
-    static get requires() {
-        return [ CopyToClipboardEditing, CopyToClipboardUI ];
-    }
-
-}
-
-export class CopyToClipboardUI extends Plugin {
-
     public init() {
         const editor = this.editor;
-        const componentFactory = editor.ui.componentFactory;
+        editor.commands.add("copyToClipboard", new CopyToClipboardCommand(this.editor));
 
+        const componentFactory = editor.ui.componentFactory;
         componentFactory.add("copyToClipboard", locale => {
             const button = new ButtonView(locale);
             button.set({
@@ -32,14 +25,6 @@ export class CopyToClipboardUI extends Plugin {
 
 }
 
-export class CopyToClipboardEditing extends Plugin {
-
-    public init() {
-        this.editor.commands.add("copyToClipboard", new CopyToClipboardCommand(this.editor));
-    }
-
-}
-
 export class CopyToClipboardCommand extends Command {
 
     execute(...args: Array<unknown>) {

From 4752db6bc5ad4ca1c188a281cf8a838fa7bf2c63 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 12:35:30 +0300
Subject: [PATCH 08/14] style(ckeditor5/codeblock): limit language selector
 height

---
 packages/ckeditor5/src/index.ts                      | 1 +
 packages/ckeditor5/src/plugins/code_block_toolbar.ts | 1 +
 packages/ckeditor5/src/theme/code_block_toolbar.css  | 4 ++++
 3 files changed, 6 insertions(+)
 create mode 100644 packages/ckeditor5/src/theme/code_block_toolbar.css

diff --git a/packages/ckeditor5/src/index.ts b/packages/ckeditor5/src/index.ts
index 1a614f8e8..8dc0e3611 100644
--- a/packages/ckeditor5/src/index.ts
+++ b/packages/ckeditor5/src/index.ts
@@ -1,4 +1,5 @@
 import "ckeditor5/ckeditor5.css";
+import "./theme/code_block_toolbar.css";
 import { COMMON_PLUGINS, CORE_PLUGINS, POPUP_EDITOR_PLUGINS } from "./plugins";
 import { BalloonEditor, DecoupledEditor, FindAndReplaceEditing, FindCommand } from "ckeditor5";
 export { EditorWatchdog } from "ckeditor5";
diff --git a/packages/ckeditor5/src/plugins/code_block_toolbar.ts b/packages/ckeditor5/src/plugins/code_block_toolbar.ts
index 4f886efa8..ff9014fd8 100644
--- a/packages/ckeditor5/src/plugins/code_block_toolbar.ts
+++ b/packages/ckeditor5/src/plugins/code_block_toolbar.ts
@@ -18,6 +18,7 @@ export default class CodeBlockToolbar extends Plugin {
                 "|",
                 "copyToClipboard"
             ],
+            balloonClassName: "ck-toolbar-container codeblock-language-list",
             getRelatedElement(selection) {
                 const selectionPosition = selection.getFirstPosition();
                 if (!selectionPosition) {
diff --git a/packages/ckeditor5/src/theme/code_block_toolbar.css b/packages/ckeditor5/src/theme/code_block_toolbar.css
new file mode 100644
index 000000000..0776571b4
--- /dev/null
+++ b/packages/ckeditor5/src/theme/code_block_toolbar.css
@@ -0,0 +1,4 @@
+.ck.ck-balloon-panel.codeblock-language-list .ck-dropdown__panel {
+    max-height: 300px;
+    overflow-y: auto;
+}
\ No newline at end of file

From 02e2b5d4ad4a0bfc0e7c7f1ad3c3fcd1b03c2d53 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 15:17:10 +0300
Subject: [PATCH 09/14] feat(client): add a copy button to read-only text

---
 apps/client/src/services/content_renderer.ts  |  4 ++--
 apps/client/src/services/doc_renderer.ts      |  4 ++--
 apps/client/src/services/syntax_highlight.ts  | 22 ++++++++++++++-----
 apps/client/src/stylesheets/style.css         | 20 +++++++++++++++++
 .../src/widgets/llm_chat/llm_chat_panel.ts    |  4 ++--
 apps/client/src/widgets/llm_chat/utils.ts     |  4 ++--
 .../widgets/type_widgets/read_only_text.ts    |  4 ++--
 7 files changed, 46 insertions(+), 16 deletions(-)

diff --git a/apps/client/src/services/content_renderer.ts b/apps/client/src/services/content_renderer.ts
index 0664f6a5c..08ed561ff 100644
--- a/apps/client/src/services/content_renderer.ts
+++ b/apps/client/src/services/content_renderer.ts
@@ -9,7 +9,7 @@ import treeService from "./tree.js";
 import FNote from "../entities/fnote.js";
 import FAttachment from "../entities/fattachment.js";
 import imageContextMenuService from "../menus/image_context_menu.js";
-import { applySingleBlockSyntaxHighlight, applySyntaxHighlight } from "./syntax_highlight.js";
+import { applySingleBlockSyntaxHighlight, formatCodeBlocks } from "./syntax_highlight.js";
 import { loadElkIfNeeded, postprocessMermaidSvg } from "./mermaid.js";
 import renderDoc from "./doc_renderer.js";
 import { t } from "../services/i18n.js";
@@ -106,7 +106,7 @@ async function renderText(note: FNote | FAttachment, $renderedContent: JQuery<HT
             await linkService.loadReferenceLinkTitle($(el));
         }
 
-        await applySyntaxHighlight($renderedContent);
+        await formatCodeBlocks($renderedContent);
     } else if (note instanceof FNote) {
         await renderChildrenList($renderedContent, note);
     }
diff --git a/apps/client/src/services/doc_renderer.ts b/apps/client/src/services/doc_renderer.ts
index 4192caf8c..1eca3d7c6 100644
--- a/apps/client/src/services/doc_renderer.ts
+++ b/apps/client/src/services/doc_renderer.ts
@@ -1,6 +1,6 @@
 import type FNote from "../entities/fnote.js";
 import { getCurrentLanguage } from "./i18n.js";
-import { applySyntaxHighlight } from "./syntax_highlight.js";
+import { formatCodeBlocks } from "./syntax_highlight.js";
 
 export default function renderDoc(note: FNote) {
     return new Promise<JQuery<HTMLElement>>((resolve) => {
@@ -41,7 +41,7 @@ function processContent(url: string, $content: JQuery<HTMLElement>) {
         $img.attr("src", dir + "/" + $img.attr("src"));
     });
 
-    applySyntaxHighlight($content);
+    formatCodeBlocks($content);
 }
 
 function getUrl(docNameValue: string, language: string) {
diff --git a/apps/client/src/services/syntax_highlight.ts b/apps/client/src/services/syntax_highlight.ts
index 7dfb29f30..0cb7cbf2d 100644
--- a/apps/client/src/services/syntax_highlight.ts
+++ b/apps/client/src/services/syntax_highlight.ts
@@ -6,16 +6,16 @@ let highlightingLoaded = false;
 
 /**
  * Identifies all the code blocks (as `pre code`) under the specified hierarchy and uses the highlight.js library to obtain the highlighted text which is then applied on to the code blocks.
+ * Additionally, adds a "Copy to clipboard" button.
  *
  * @param $container the container under which to look for code blocks and to apply syntax highlighting to them.
  */
-export async function applySyntaxHighlight($container: JQuery<HTMLElement>) {
-    if (!isSyntaxHighlightEnabled()) {
-        return;
+export async function formatCodeBlocks($container: JQuery<HTMLElement>) {
+    const syntaxHighlightingEnabled = isSyntaxHighlightEnabled();
+    if (syntaxHighlightingEnabled) {
+        await ensureMimeTypesForHighlighting();
     }
 
-    await ensureMimeTypesForHighlighting();
-
     const codeBlocks = $container.find("pre code");
     for (const codeBlock of codeBlocks) {
         const normalizedMimeType = extractLanguageFromClassList(codeBlock);
@@ -23,10 +23,20 @@ export async function applySyntaxHighlight($container: JQuery<HTMLElement>) {
             continue;
         }
 
-        applySingleBlockSyntaxHighlight($(codeBlock), normalizedMimeType);
+        applyCopyToClipboardButton($(codeBlock));
+
+        if (syntaxHighlightingEnabled) {
+            applySingleBlockSyntaxHighlight($(codeBlock), normalizedMimeType);
+        }
     }
 }
 
+export function applyCopyToClipboardButton($codeBlock: JQuery<HTMLElement>) {
+    const $copyButton = $("<button>")
+        .addClass("bx component btn tn-tool-button bx-copy copy-button");
+    $codeBlock.parent().append($copyButton);
+}
+
 /**
  * Applies syntax highlight to the given code block (assumed to be <pre><code>), using highlight.js.
  */
diff --git a/apps/client/src/stylesheets/style.css b/apps/client/src/stylesheets/style.css
index be1c8e717..149ae03cd 100644
--- a/apps/client/src/stylesheets/style.css
+++ b/apps/client/src/stylesheets/style.css
@@ -529,6 +529,26 @@ pre:not(.hljs) {
     font-size: 100%;
 }
 
+pre {
+    position: relative;
+}
+
+pre > button.copy-button {
+    position: absolute;
+    top: 1em;
+    right: 1em;
+    opacity: 0.8;    
+}
+
+pre > button.copy-button:hover {
+    color: inherit !important;
+    opacity: 1;
+}
+
+pre > button.copy-button:active {
+    background-color: unset !important;
+}
+
 .pointer {
     cursor: pointer;
 }
diff --git a/apps/client/src/widgets/llm_chat/llm_chat_panel.ts b/apps/client/src/widgets/llm_chat/llm_chat_panel.ts
index 7cbd6a802..5c6550346 100644
--- a/apps/client/src/widgets/llm_chat/llm_chat_panel.ts
+++ b/apps/client/src/widgets/llm_chat/llm_chat_panel.ts
@@ -12,7 +12,7 @@ import { createChatSession, checkSessionExists, setupStreamingResponse, getDirec
 import { extractInChatToolSteps } from "./message_processor.js";
 import { validateEmbeddingProviders } from "./validation.js";
 import type { MessageData, ToolExecutionStep, ChatData } from "./types.js";
-import { applySyntaxHighlight } from "../../services/syntax_highlight.js";
+import { formatCodeBlocks } from "../../services/syntax_highlight.js";
 
 import "../../stylesheets/llm_chat.css";
 
@@ -925,7 +925,7 @@ export default class LlmChatPanel extends BasicWidget {
 
         // Apply syntax highlighting if this is the final update
         if (isDone) {
-            applySyntaxHighlight($(assistantMessageEl as HTMLElement));
+            formatCodeBlocks($(assistantMessageEl as HTMLElement));
 
             // Update message in the data model for storage
             // Find the last assistant message to update, or add a new one if none exists
diff --git a/apps/client/src/widgets/llm_chat/utils.ts b/apps/client/src/widgets/llm_chat/utils.ts
index f7a880d69..f7c68e9ef 100644
--- a/apps/client/src/widgets/llm_chat/utils.ts
+++ b/apps/client/src/widgets/llm_chat/utils.ts
@@ -2,7 +2,7 @@
  * Utility functions for LLM Chat
  */
 import { marked } from "marked";
-import { applySyntaxHighlight } from "../../services/syntax_highlight.js";
+import { formatCodeBlocks } from "../../services/syntax_highlight.js";
 
 /**
  * Format markdown content for display
@@ -62,7 +62,7 @@ export function escapeHtml(text: string): string {
  * Apply syntax highlighting to content
  */
 export function applyHighlighting(element: HTMLElement): void {
-    applySyntaxHighlight($(element));
+    formatCodeBlocks($(element));
 }
 
 /**
diff --git a/apps/client/src/widgets/type_widgets/read_only_text.ts b/apps/client/src/widgets/type_widgets/read_only_text.ts
index 55d45a5ae..59f99af33 100644
--- a/apps/client/src/widgets/type_widgets/read_only_text.ts
+++ b/apps/client/src/widgets/type_widgets/read_only_text.ts
@@ -1,5 +1,5 @@
 import AbstractTextTypeWidget from "./abstract_text_type_widget.js";
-import { applySyntaxHighlight } from "../../services/syntax_highlight.js";
+import { formatCodeBlocks } from "../../services/syntax_highlight.js";
 import type FNote from "../../entities/fnote.js";
 import type { CommandListenerData, EventData } from "../../components/app_context.js";
 import { getLocaleById } from "../../services/i18n.js";
@@ -125,7 +125,7 @@ export default class ReadOnlyTextTypeWidget extends AbstractTextTypeWidget {
         }
 
         await this.#applyInlineMermaid();
-        await applySyntaxHighlight(this.$content);
+        await formatCodeBlocks(this.$content);
     }
 
     async #applyInlineMermaid() {

From b177e7a637d5e2163e2e78365e75c474a2ad15ca Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 15:19:53 +0300
Subject: [PATCH 10/14] feat(client/read-only-text): implement copying to
 clipboard

---
 apps/client/src/services/syntax_highlight.ts | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/apps/client/src/services/syntax_highlight.ts b/apps/client/src/services/syntax_highlight.ts
index 0cb7cbf2d..0e4a2f031 100644
--- a/apps/client/src/services/syntax_highlight.ts
+++ b/apps/client/src/services/syntax_highlight.ts
@@ -1,6 +1,7 @@
 import { ensureMimeTypes, highlight, highlightAuto, loadTheme, Themes } from "@triliumnext/highlightjs";
 import mime_types from "./mime_types.js";
 import options from "./options.js";
+import toast from "./toast.js";
 
 let highlightingLoaded = false;
 
@@ -33,7 +34,17 @@ export async function formatCodeBlocks($container: JQuery<HTMLElement>) {
 
 export function applyCopyToClipboardButton($codeBlock: JQuery<HTMLElement>) {
     const $copyButton = $("<button>")
-        .addClass("bx component btn tn-tool-button bx-copy copy-button");
+        .addClass("bx component btn tn-tool-button bx-copy copy-button")
+        .on("click", () => {
+            const text = $codeBlock.text();
+
+            try {
+                navigator.clipboard.writeText(text);
+                toast.showMessage("The code block was copied to clipboard.");
+            } catch (e) {
+                toast.showError("The code block could not be copied to the clipboard due to lack of permissions.");
+            }
+        });
     $codeBlock.parent().append($copyButton);
 }
 

From 612566d9d25550b4e8ae01791c845cc4b85a8333 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 15:21:23 +0300
Subject: [PATCH 11/14] chore(client): use translations

---
 apps/client/src/services/syntax_highlight.ts     | 5 +++--
 apps/client/src/translations/en/translation.json | 4 +++-
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/apps/client/src/services/syntax_highlight.ts b/apps/client/src/services/syntax_highlight.ts
index 0e4a2f031..09d18f3a0 100644
--- a/apps/client/src/services/syntax_highlight.ts
+++ b/apps/client/src/services/syntax_highlight.ts
@@ -2,6 +2,7 @@ import { ensureMimeTypes, highlight, highlightAuto, loadTheme, Themes } from "@t
 import mime_types from "./mime_types.js";
 import options from "./options.js";
 import toast from "./toast.js";
+import { t } from "./i18n.js";
 
 let highlightingLoaded = false;
 
@@ -40,9 +41,9 @@ export function applyCopyToClipboardButton($codeBlock: JQuery<HTMLElement>) {
 
             try {
                 navigator.clipboard.writeText(text);
-                toast.showMessage("The code block was copied to clipboard.");
+                toast.showMessage(t("code_block.copy_success"));
             } catch (e) {
-                toast.showError("The code block could not be copied to the clipboard due to lack of permissions.");
+                toast.showError(t("code_block.copy_failed"));
             }
         });
     $codeBlock.parent().append($copyButton);
diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json
index 683eb42b2..cc3884e92 100644
--- a/apps/client/src/translations/en/translation.json
+++ b/apps/client/src/translations/en/translation.json
@@ -1830,7 +1830,9 @@
     "word_wrapping": "Word wrapping",
     "theme_none": "No syntax highlighting",
     "theme_group_light": "Light themes",
-    "theme_group_dark": "Dark themes"
+    "theme_group_dark": "Dark themes",
+    "copy_success": "The code block was copied to clipboard.",
+    "copy_failed": "The code block could not be copied to the clipboard due to lack of permissions."
   },
   "classic_editor_toolbar": {
     "title": "Formatting"

From 426549a189819a103bc01657ae6285ea773cb46c Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 15:40:57 +0300
Subject: [PATCH 12/14] chore(client): use translations

---
 apps/client/src/services/syntax_highlight.ts     | 1 +
 apps/client/src/translations/en/translation.json | 3 ++-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/apps/client/src/services/syntax_highlight.ts b/apps/client/src/services/syntax_highlight.ts
index 09d18f3a0..f6b7f8ff7 100644
--- a/apps/client/src/services/syntax_highlight.ts
+++ b/apps/client/src/services/syntax_highlight.ts
@@ -36,6 +36,7 @@ export async function formatCodeBlocks($container: JQuery<HTMLElement>) {
 export function applyCopyToClipboardButton($codeBlock: JQuery<HTMLElement>) {
     const $copyButton = $("<button>")
         .addClass("bx component btn tn-tool-button bx-copy copy-button")
+        .attr("title", t("code_block.copy_title"))
         .on("click", () => {
             const text = $codeBlock.text();
 
diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json
index cc3884e92..7008ed7d8 100644
--- a/apps/client/src/translations/en/translation.json
+++ b/apps/client/src/translations/en/translation.json
@@ -1832,7 +1832,8 @@
     "theme_group_light": "Light themes",
     "theme_group_dark": "Dark themes",
     "copy_success": "The code block was copied to clipboard.",
-    "copy_failed": "The code block could not be copied to the clipboard due to lack of permissions."
+    "copy_failed": "The code block could not be copied to the clipboard due to lack of permissions.",
+    "copy_title": "Copy to clipboard"
   },
   "classic_editor_toolbar": {
     "title": "Formatting"

From b5c09eee730ac16389133f86376b3dbce97263d3 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 15:46:02 +0300
Subject: [PATCH 13/14] refactor(client): missing type errors for syntax
 highlight

---
 apps/client/src/services/syntax_highlight.ts | 6 +++---
 packages/highlightjs/src/index.ts            | 1 +
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/apps/client/src/services/syntax_highlight.ts b/apps/client/src/services/syntax_highlight.ts
index f6b7f8ff7..6780f8130 100644
--- a/apps/client/src/services/syntax_highlight.ts
+++ b/apps/client/src/services/syntax_highlight.ts
@@ -1,4 +1,4 @@
-import { ensureMimeTypes, highlight, highlightAuto, loadTheme, Themes } from "@triliumnext/highlightjs";
+import { ensureMimeTypes, highlight, highlightAuto, loadTheme, Themes, type AutoHighlightResult, type HighlightResult, type Theme } from "@triliumnext/highlightjs";
 import mime_types from "./mime_types.js";
 import options from "./options.js";
 import toast from "./toast.js";
@@ -57,7 +57,7 @@ export async function applySingleBlockSyntaxHighlight($codeBlock: JQuery<HTMLEle
     $codeBlock.parent().toggleClass("hljs");
     const text = $codeBlock.text();
 
-    let highlightedText = null;
+    let highlightedText: HighlightResult | AutoHighlightResult | null = null;
     if (normalizedMimeType === mime_types.MIME_TYPE_AUTO) {
         await ensureMimeTypesForHighlighting();
         highlightedText = highlightAuto(text);
@@ -89,7 +89,7 @@ export async function ensureMimeTypesForHighlighting() {
 
 export function loadHighlightingTheme(themeName: string) {
     const themePrefix = "default:";
-    let theme = null;
+    let theme: Theme | null = null;
     if (themeName.includes(themePrefix)) {
         theme = Themes[themeName.substring(themePrefix.length)];
     }
diff --git a/packages/highlightjs/src/index.ts b/packages/highlightjs/src/index.ts
index bc1b6b71a..29ffec2a7 100644
--- a/packages/highlightjs/src/index.ts
+++ b/packages/highlightjs/src/index.ts
@@ -3,6 +3,7 @@ import { normalizeMimeTypeForCKEditor, type MimeType } from "@triliumnext/common
 import syntaxDefinitions from "./syntax_highlighting.js";
 import { type Theme } from "./themes.js";
 import { type HighlightOptions } from "highlight.js";
+export type { HighlightResult, AutoHighlightResult } from "highlight.js";
 
 export { default as Themes, type Theme } from "./themes.js";
 

From ca65cafe31766531e944cfe3ab575d158f3128c1 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 26 May 2025 15:51:14 +0300
Subject: [PATCH 14/14] docs(release): mention code blocks change

---
 docs/Release Notes/Release Notes/v0.94.0.md | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/docs/Release Notes/Release Notes/v0.94.0.md b/docs/Release Notes/Release Notes/v0.94.0.md
index 340d5404e..8c7e4d7aa 100644
--- a/docs/Release Notes/Release Notes/v0.94.0.md	
+++ b/docs/Release Notes/Release Notes/v0.94.0.md	
@@ -49,6 +49,9 @@
 *   Backend log: disable some editor features in order to increase performance for large logs (syntax highlighting, folding, etc.).
 *   [Collapsible table of contents](https://github.com/TriliumNext/Notes/pull/1954) by @SiriusXT
 *   Sessions (logins) are no longer stored as files in the data directory, but as entries in the database. This improves the session reliability on Windows platforms.
+*   Code blocks in text notes:
+    *   For editable notes, clicking on a code block will reveal a toolbar with a way to easily change the programming language and another button to copy the text to clipboard.
+    *   For read-only notes, a floating button allows copying the code snippet to clipboard.
 
 ## 📖 Documentation