refactor(editor): move all options into this repo

This commit is contained in:
Elian Doran 2025-02-11 20:23:48 +02:00
parent aad38fdd21
commit f517e4a37a
No known key found for this signature in database
5 changed files with 124 additions and 18 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -15,6 +15,7 @@ import type { CommandData, EventData, EventListener, FilteredCommandNames } from
import type { default as FAttribute, AttributeType } from "../../entities/fattribute.js";
import type FNote from "../../entities/fnote.js";
import { escapeQuotes } from "../../services/utils.js";
import { buildConfig } from "../type_widgets/ckeditor/toolbars.js";
const HELP_TEXT = `
<p>${t("attribute_editor.help_text_body1")}</p>
@ -130,6 +131,7 @@ const mentionSetup: MentionConfig = {
};
const editorConfig = {
...buildConfig(),
removePlugins: [
"Heading",
"Link",

View File

@ -1,6 +1,118 @@
import options from "../../../services/options.js";
import utils from "../../../services/utils.js";
export function buildConfig() {
return {
image: {
styles: {
options: [
'inline',
'alignBlockLeft',
'alignCenter',
'alignBlockRight',
'alignLeft',
'alignRight',
'full', // full and side are for BC since the old images have been created with these styles
'side'
]
},
resizeOptions: [
{
name: 'imageResize:original',
value: null,
icon: 'original'
},
{
name: 'imageResize:25',
value: '25',
icon: 'small'
},
{
name: 'imageResize:50',
value: '50',
icon: 'medium'
},
{
name: 'imageResize:75',
value: '75',
icon: 'medium'
}
],
toolbar: [
// Image styles, see https://ckeditor.com/docs/ckeditor5/latest/features/images/images-styles.html#demo.
'imageStyle:inline',
'imageStyle:alignCenter',
{
name: "imageStyle:wrapText",
title: "Wrap text",
items: [
'imageStyle:alignLeft',
'imageStyle:alignRight',
],
defaultItem: 'imageStyle:alignRight'
},
{
name: "imageStyle:block",
title: "Block align",
items: [
'imageStyle:alignBlockLeft',
'imageStyle:alignBlockRight'
],
defaultItem: "imageStyle:alignBlockLeft",
},
'|',
'imageResize:25',
'imageResize:50',
'imageResize:original',
'|',
'toggleImageCaption'
],
upload: {
types: [ 'jpeg', 'png', 'gif', 'bmp', 'webp', 'tiff', 'svg', 'svg+xml', 'avif' ]
}
},
heading: {
options: [
{ model: 'paragraph' as const, title: 'Paragraph', class: 'ck-heading_paragraph' },
// // heading1 is not used since that should be a note's title
{ model: 'heading2' as const, view: 'h2', title: 'Heading 2', class: 'ck-heading_heading2' },
{ model: 'heading3' as const, view: 'h3', title: 'Heading 3', class: 'ck-heading_heading3' },
{ model: 'heading4' as const, view: 'h4', title: 'Heading 4', class: 'ck-heading_heading4' },
{ model: 'heading5' as const, view: 'h5', title: 'Heading 5', class: 'ck-heading_heading5' },
{ model: 'heading6' as const, view: 'h6', title: 'Heading 6', class: 'ck-heading_heading6' }
]
},
table: {
contentToolbar: [
'tableColumn',
'tableRow',
'mergeTableCells',
'tableProperties',
'tableCellProperties',
'toggleTableCaption'
]
},
list: {
properties: {
styles: true,
startIndex: true,
reversed: true
}
},
link: {
defaultProtocol: 'https://',
allowedProtocols: [
'http', 'https', 'ftp', 'ftps', 'mailto', 'data', 'evernote', 'file', 'facetime', 'gemini', 'git',
'gopher', 'imap', 'irc', 'irc6', 'jabber', 'jar', 'lastfm', 'ldap', 'ldaps', 'magnet', 'message',
'mumble', 'nfs', 'onenote', 'pop', 'rmi', 's3', 'sftp', 'skype', 'sms', 'spotify', 'steam', 'svn', 'udp',
'view-source', 'vlc', 'vnc', 'ws', 'wss', 'xmpp', 'jdbc', 'slack', 'tel', 'smb', 'zotero', 'geo'
]
},
// This value must be kept in sync with the language defined in webpack.config.js.
language: 'en'
}
}
export function buildToolbarConfig(isClassicToolbar: boolean) {
if (isClassicToolbar) {
const multilineToolbar = utils.isDesktop() && options.get("textNoteEditorMultilineToolbar") === "true"
@ -15,11 +127,9 @@ function buildClassicToolbar(multilineToolbar: boolean) {
return {
toolbar: {
items: [
'heading',
'fontSize',
'heading', 'fontSize',
'|',
'bold',
'italic',
'bold', 'italic',
{
label: "Text formatting",
icon: "text",
@ -32,16 +142,11 @@ function buildClassicToolbar(multilineToolbar: boolean) {
],
},
'|',
'fontColor',
'fontBackgroundColor',
'removeFormat',
'fontColor', 'fontBackgroundColor', 'removeFormat',
'|',
'bulletedList', 'numberedList', 'todoList',
'|',
'blockQuote',
'insertTable',
'codeBlock',
'footnote',
'blockQuote', 'insertTable', 'codeBlock', 'footnote',
{
label: "Insert",
icon: "plus",
@ -62,9 +167,7 @@ function buildClassicToolbar(multilineToolbar: boolean) {
'|',
'outdent', 'indent',
'|',
'markdownImport',
'cuttonote',
'findAndReplace'
'markdownImport', 'cuttonote', 'findAndReplace'
],
shouldNotGroupWhenFull: multilineToolbar
}

View File

@ -15,7 +15,7 @@ import options from "../../services/options.js";
import toast from "../../services/toast.js";
import { getMermaidConfig } from "../mermaid.js";
import { normalizeMimeTypeForCKEditor } from "../../services/mime_type_definitions.js";
import { buildToolbarConfig } from "./ckeditor/toolbars.js";
import { buildConfig, buildToolbarConfig } from "./ckeditor/toolbars.js";
const ENABLE_INSPECTOR = false;
@ -187,7 +187,8 @@ export default class EditableTextTypeWidget extends AbstractTextTypeWidget {
const editor = await editorClass.create(elementOrData, {
...editorConfig,
...buildToolbarConfig(),
...buildConfig(),
...buildToolbarConfig(isClassicEditor),
htmlSupport: {
allow: JSON.parse(options.get("allowedHtmlTags")),
styles: true,