chore(ckeditor5/plugins): integrate cuttonote

packages/ckeditor5/src/augmentation.ts

@@ -0,0 +1,16 @@
+import "ckeditor5";
+
+declare global {
+    var glob: {
+        getComponentByEl(el: unknown): {
+            triggerCommand(command: string): void;
+        };
+    }
+}
+
+declare module "ckeditor5" {
+    interface Editor {
+        getSelectedHtml(): string;
+        removeSelection(): Promise<void>;
+    }
+}

packages/ckeditor5/src/icons/scissors.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Svg Vector Icons : http://www.onlinewebfonts.com/icon -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1000 1000" enable-background="new 0 0 1000 1000" xml:space="preserve">
+<metadata> Svg Vector Icons : http://www.onlinewebfonts.com/icon </metadata>
+<g><g><path d="M853.9,754.9c-26-45.4-66.5-76.2-109.1-87.8c-33.7-9.2-68.7-6.4-98.9,10.7l-90-157.3C611.6,409.5,736.5,160.5,759,121.2C788,70.4,736,10,736,10L500,422.8L264,10c0,0-52,60.4-22.9,111.2c22.5,39.3,147.5,288.3,203.1,399.3l-89.9,157.3c-30.2-17.1-65.3-19.9-98.9-10.7c-42.7,11.6-83.1,42.3-109.1,87.8c-46.8,81.7-28.9,179.7,39.7,219c30.4,17.5,65.7,20.3,99.6,11.1c42.6-11.6,83.1-42.4,109.1-87.7c11.4-20,18.9-41,22.8-61.8v0c0-0.2,0-0.3,0.2-0.5c0.2-1.7,0.5-3.5,0.7-5.4c19.3-129.5,55.8-195.7,81.6-227.8c25.9,32.1,62.4,98.3,81.7,227.8c0.2,1.9,0.5,3.6,0.7,5.4c0.1,0.2,0.1,0.3,0.2,0.5v0c3.9,20.8,11.4,41.8,22.7,61.8c26,45.3,66.5,76.1,109.2,87.7c34,9.2,69.2,6.4,99.7-11.1C882.8,934.5,900.6,836.5,853.9,754.9z M327.9,858.9c-14.8,25.8-38.1,45.2-62.5,51.8c-10.8,3-26.7,4.7-41.3-3.6c-31.1-17.8-36.2-70.1-11.1-114c15-26,37.8-45,62.5-51.8c10.7-2.9,26.7-4.7,41.3,3.6C347.9,762.7,353,814.9,327.9,858.9z M775.9,907.1c-14.6,8.4-30.4,6.6-41.3,3.6c-24.4-6.6-47.7-26-62.5-51.8c-25.1-44-20-96.2,11.1-114c14.7-8.3,30.6-6.5,41.3-3.6C749.3,748,772.1,767,787,793C812.1,837,807.1,889.3,775.9,907.1z"/><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g></g>
+</svg>

packages/ckeditor5/src/plugins.ts

@@ -1,6 +1,12 @@
 import { Autoformat, AutoLink, BlockQuote, Bold, CKFinderUploadAdapter, Clipboard, Code, CodeBlock, Enter, FindAndReplace, Font, FontBackgroundColor, FontColor, GeneralHtmlSupport, Heading, HeadingButtonsUI, HorizontalLine, Image, ImageCaption, ImageInline, ImageResize, ImageStyle, ImageToolbar, ImageUpload, Indent, IndentBlock, Italic, Link, List, ListProperties, Mention, PageBreak, Paragraph, ParagraphButtonUI, PasteFromOffice, PictureEditing, RemoveFormat, SelectAll, ShiftEnter, SpecialCharacters, SpecialCharactersEssentials, Strikethrough, Style, Subscript, Superscript, Table, TableCaption, TableCellProperties, TableColumnResize, TableProperties, TableSelection, TableToolbar, TextPartLanguage, TextTransformation, TodoList, Typing, Underline, Undo } from "ckeditor5";
+import type { Plugin } from "ckeditor5";
+import CutToNotePlugin from "./plugins/cuttonote.js";
 
-export const COMMON_PLUGINS = [
+const TRILIUM_PLUGINS: typeof Plugin[] = [
+    CutToNotePlugin
+];
+
+export const COMMON_PLUGINS: typeof Plugin[] = [
 	// essentials package expanded to allow selectively disable Enter and ShiftEnter
 	Clipboard, Enter, SelectAll, ShiftEnter, Typing, Undo,
 	CKFinderUploadAdapter,
@@ -59,7 +65,6 @@ export const COMMON_PLUGINS = [
 	// ItalicAsEmPlugin,
 	// StrikethroughAsDel,
 	// MarkdownImportPlugin,
-	// CuttonotePlugin,
 	// MentionCustomization,
 	// IncludeNote,
 	// ReferenceLink,
@@ -77,6 +82,8 @@ export const COMMON_PLUGINS = [
 	// Mermaid,
 	// Kbd,
 	// Admonition
+
+    ...TRILIUM_PLUGINS
 ];
 
 export const COMMON_SETTINGS = { };

packages/ckeditor5/src/plugins/cuttonote.ts

@@ -0,0 +1,62 @@
+import scissorsIcon from '../icons/scissors.svg?raw';
+import { ButtonView, HtmlDataProcessor, Plugin } from 'ckeditor5';
+
+export default class CutToNotePlugin extends Plugin {
+
+    private htmlDataProcessor!: HtmlDataProcessor;
+
+	init() {
+        // @ts-ignore Not sure why we need to pass a document.
+		this.htmlDataProcessor = new HtmlDataProcessor();
+
+		this.editor.ui.componentFactory.add( 'cutToNote', locale => {
+			const view = new ButtonView( locale );
+
+            console.log("Got ", scissorsIcon);
+			view.set( {
+				label: 'Cut & paste selection to sub-note',
+				// icon: scissorsIcon,
+				tooltip: true
+			} );
+
+			// Callback executed once the image is clicked.
+			view.on('execute', () => {
+				const editorEl = this.editor.editing.view.getDomRoot();
+				const component = glob.getComponentByEl(editorEl);
+
+				component.triggerCommand('cutIntoNote');
+			});
+
+			return view;
+		} );
+
+		this.editor.getSelectedHtml = () => this.getSelectedHtml();
+		this.editor.removeSelection = () => this.removeSelection();
+	}
+
+	getSelectedHtml() {
+		const model = this.editor.model;
+		const document = model.document;
+
+		const content = this.editor.data.toView(model.getSelectedContent(document.selection));
+
+		return this.htmlDataProcessor.toData(content);
+	}
+
+	async removeSelection() {
+		const model = this.editor.model;
+
+		model.deleteContent(model.document.selection);
+		this.editor.execute("paragraph");
+
+		const component = this.getComponent();
+
+		await component.triggerCommand('saveNoteDetailNow');
+	}
+
+	getComponent() {
+		const editorEl = this.editor.editing.view.getDomRoot();
+
+		return glob.getComponentByEl( editorEl );
+	}
+}

packages/ckeditor5/tsconfig.lib.json

@@ -1,6 +1,8 @@
 {
   "extends": "../../tsconfig.base.json",
   "compilerOptions": {
+    "module": "ESNext",
+    "moduleResolution": "bundler",
     "baseUrl": ".",
     "rootDir": "src",
     "outDir": "dist",