mirror of
				https://github.com/zadam/trilium.git
				synced 2025-11-03 20:06:08 +01:00 
			
		
		
		
	feat(ckeditor5): create an empty toolbar for code blocks
This commit is contained in:
		@@ -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
 | 
			
		||||
];
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										45
									
								
								packages/ckeditor5/src/plugins/code_block_toolbar.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										45
									
								
								packages/ckeditor5/src/plugins/code_block_toolbar.ts
									
									
									
									
									
										Normal file
									
								
							@@ -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;
 | 
			
		||||
            }
 | 
			
		||||
        });
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
		Reference in New Issue
	
	Block a user