There is also the possibility of inserting emojis directly by typing : followed
by a name of an emoji, triggering the display of a list of emojis. Simply
- use the arrow keys to select one and press Enter to insert it.
-
-
-
-
-
+ use the arrow keys to select one and press Enter to insert it.
+
+
Symbols
-
-
-
-
Pressing the
- button will reveal a popup window displaying a list of characters that
- are generally more difficult to insert directly from the keyboard, such
- as a subset of emojis, quotation characters, etc.
-
Interaction:
-
-
Click on a character to insert it at the current cursor position.
-
The window can be dragged around by the top bar where the title is, to
- avoid it getting in the way of the text.
-
Click on the Category selector to filter the characters.
Press the
- button to create an inline Mermaid diagram.
-
This feature is quite similar to the Mermaid Diagrams note
- types and is meant as an alternative to it for simple diagrams. For more
- complex diagrams, use the Include Note feature
- for a dedicated Mermaid note.
-
-
-
+
+
+
+
Pressing the
+ button will reveal a popup window displaying a list of characters that
+ are generally more difficult to insert directly from the keyboard, such
+ as a subset of emojis, quotation characters, etc.
+
Interaction:
+
+
Click on a character to insert it at the current cursor position.
+
The window can be dragged around by the top bar where the title is, to
+ avoid it getting in the way of the text.
+
Click on the Category selector to filter the characters.
Press the
+ button to create an inline Mermaid diagram.
+
This feature is quite similar to the Mermaid Diagrams note
+ types and is meant as an alternative to it for simple diagrams. For more
+ complex diagrams, use the Include Note feature
+ for a dedicated Mermaid note.
+
+
+
+
Horizontal ruler
-
This feature will display a horizontal line, generally useful to separate
- different sections of the text. To do so, press the
- button in the Formatting toolbar.
-
-
-
-
Alternatively, it's possible to insert a horizontal ruler by typing ---.
-
Page break
-
-
-
-
Page breaks provide a way to force the next paragraph or block (table,
- image, etc.) to be displayed onto the next page when printing (either to
- a real printer to when exporting to PDF).
-
Page breaks are marked in the editor with the words Page break,
- but they will not actually be shown when printed.
-
-
To insert a page break, press the
- in the formatting toolbar.
-
To insert many page breaks at once, insert a page break first, click on
- it and press Ctrl+C. Then use Ctrl+V,
- to paste as many times as needed.
-
\ No newline at end of file
+
This feature will display a horizontal line, generally useful to separate
+ different sections of the text. To do so, press the
+ button in the Formatting toolbar.
+
+
Alternatively, it's possible to insert a horizontal ruler by typing ---.
+
Page break
+
+
+
+
Page breaks provide a way to force the next paragraph or block (table,
+ image, etc.) to be displayed onto the next page when printing (either to
+ a real printer to when exporting to PDF).
+
Page breaks are marked in the editor with the words Page break,
+ but they will not actually be shown when printed.
+
+
To insert a page break, press the
+ in the formatting toolbar.
+
To insert many page breaks at once, insert a page break first, click on
+ it and press Ctrl+C. Then use Ctrl+V,
+ to paste as many times as needed.
+
\ No newline at end of file
diff --git a/apps/server/src/assets/doc_notes/en/User Guide/User Guide/Note Types/Text/Markdown-like formatting.html b/apps/server/src/assets/doc_notes/en/User Guide/User Guide/Note Types/Text/Markdown-like formatting.html
index 5ac75f1fe..165093de0 100644
--- a/apps/server/src/assets/doc_notes/en/User Guide/User Guide/Note Types/Text/Markdown-like formatting.html
+++ b/apps/server/src/assets/doc_notes/en/User Guide/User Guide/Note Types/Text/Markdown-like formatting.html
@@ -59,8 +59,8 @@
with the text inside of it.
-
For emojis,
- type : followed by an emoji name to trigger an auto-completion.
+
For emojis, type : followed
+ by an emoji name to trigger an auto-completion.
If auto-formatting is not desirable, press Ctrl + Z to
revert the text to its original form.
\ No newline at end of file
diff --git a/apps/server/src/assets/doc_notes/en/User Guide/User Guide/Note Types/Text/Math Equations.html b/apps/server/src/assets/doc_notes/en/User Guide/User Guide/Note Types/Text/Math Equations.html
index b9a4eeb35..dd41d19ab 100644
--- a/apps/server/src/assets/doc_notes/en/User Guide/User Guide/Note Types/Text/Math Equations.html
+++ b/apps/server/src/assets/doc_notes/en/User Guide/User Guide/Note Types/Text/Math Equations.html
@@ -7,7 +7,8 @@
button from the Formatting toolbar (generally
found under the Insert buttons).
If inserting equations frequently, using the Ctrl+M keyboard
- shortcut can be more comfortable.
+ shortcut can be more comfortable. Alternatively, type $$ or \[ to
+ trigger the popup directly.
There is currently no quick way to insert an equation, such as surrounding
it with $ or pressing Ctrl+M on an already
typed-out equation.
diff --git a/docs/Developer Guide/!!!meta.json b/docs/Developer Guide/!!!meta.json
index b93bbbbe1..904a715d8 100644
--- a/docs/Developer Guide/!!!meta.json
+++ b/docs/Developer Guide/!!!meta.json
@@ -69,7 +69,67 @@
],
"format": "markdown",
"dataFileName": "Project Structure.md",
- "attachments": []
+ "attachments": [],
+ "dirFileName": "Project Structure",
+ "children": [
+ {
+ "isClone": false,
+ "noteId": "Jg7clqogFOyD",
+ "notePath": [
+ "jdjRLhLV3TtI",
+ "cxfTSHIUQtt2",
+ "Jg7clqogFOyD"
+ ],
+ "title": "CKEditor",
+ "notePosition": 10,
+ "prefix": null,
+ "isExpanded": false,
+ "type": "text",
+ "mime": "text/html",
+ "attributes": [
+ {
+ "type": "label",
+ "name": "iconClass",
+ "value": "bx bx-package",
+ "isInheritable": false,
+ "position": 10
+ },
+ {
+ "type": "relation",
+ "name": "internalLink",
+ "value": "BRhQZHgwaGyw",
+ "isInheritable": false,
+ "position": 20
+ }
+ ],
+ "format": "markdown",
+ "dataFileName": "CKEditor.md",
+ "attachments": [],
+ "dirFileName": "CKEditor",
+ "children": [
+ {
+ "isClone": false,
+ "noteId": "BRhQZHgwaGyw",
+ "notePath": [
+ "jdjRLhLV3TtI",
+ "cxfTSHIUQtt2",
+ "Jg7clqogFOyD",
+ "BRhQZHgwaGyw"
+ ],
+ "title": "Plugin migration guide",
+ "notePosition": 10,
+ "prefix": null,
+ "isExpanded": false,
+ "type": "text",
+ "mime": "text/html",
+ "attributes": [],
+ "format": "markdown",
+ "dataFileName": "Plugin migration guide.md",
+ "attachments": []
+ }
+ ]
+ }
+ ]
},
{
"isClone": false,
@@ -169,15 +229,7 @@
"isExpanded": false,
"type": "text",
"mime": "text/html",
- "attributes": [
- {
- "type": "relation",
- "name": "internalLink",
- "value": "IxkDdjTogO18",
- "isInheritable": false,
- "position": 10
- }
- ],
+ "attributes": [],
"format": "markdown",
"dataFileName": "Releasing a version.md",
"attachments": []
@@ -220,6 +272,22 @@
"attachments": [],
"dirFileName": "Building and deployment",
"children": [
+ {
+ "isClone": true,
+ "noteId": "PXzm2t3sCdsP",
+ "notePath": [
+ "jdjRLhLV3TtI",
+ "ibAPHul7Efvr",
+ "sUqOpnrQyEC7",
+ "PXzm2t3sCdsP"
+ ],
+ "title": "Build deliveries locally",
+ "prefix": null,
+ "dataFileName": "Build deliveries locally.clone.md",
+ "type": "text",
+ "format": "markdown",
+ "isExpanded": false
+ },
{
"isClone": false,
"noteId": "zdQzavvHDl1k",
@@ -240,54 +308,6 @@
"dataFileName": "Documentation.md",
"attachments": []
},
- {
- "isClone": true,
- "noteId": "czgXkoEYwclZ",
- "notePath": [
- "jdjRLhLV3TtI",
- "ibAPHul7Efvr",
- "sUqOpnrQyEC7",
- "czgXkoEYwclZ"
- ],
- "title": "Running a development build",
- "prefix": null,
- "dataFileName": "Running a development build.clone.md",
- "type": "text",
- "format": "markdown",
- "isExpanded": false
- },
- {
- "isClone": true,
- "noteId": "PXzm2t3sCdsP",
- "notePath": [
- "jdjRLhLV3TtI",
- "ibAPHul7Efvr",
- "sUqOpnrQyEC7",
- "PXzm2t3sCdsP"
- ],
- "title": "Build deliveries locally",
- "prefix": null,
- "dataFileName": "Build deliveries locally.clone.md",
- "type": "text",
- "format": "markdown",
- "isExpanded": false
- },
- {
- "isClone": true,
- "noteId": "rLWcPPQi7Eso",
- "notePath": [
- "jdjRLhLV3TtI",
- "ibAPHul7Efvr",
- "sUqOpnrQyEC7",
- "rLWcPPQi7Eso"
- ],
- "title": "Releasing a version",
- "prefix": null,
- "dataFileName": "Releasing a version.clone.md",
- "type": "text",
- "format": "markdown",
- "isExpanded": false
- },
{
"isClone": false,
"noteId": "oqg9OpK8xfcm",
@@ -355,6 +375,38 @@
]
}
]
+ },
+ {
+ "isClone": true,
+ "noteId": "rLWcPPQi7Eso",
+ "notePath": [
+ "jdjRLhLV3TtI",
+ "ibAPHul7Efvr",
+ "sUqOpnrQyEC7",
+ "rLWcPPQi7Eso"
+ ],
+ "title": "Releasing a version",
+ "prefix": null,
+ "dataFileName": "Releasing a version.clone.md",
+ "type": "text",
+ "format": "markdown",
+ "isExpanded": false
+ },
+ {
+ "isClone": true,
+ "noteId": "czgXkoEYwclZ",
+ "notePath": [
+ "jdjRLhLV3TtI",
+ "ibAPHul7Efvr",
+ "sUqOpnrQyEC7",
+ "czgXkoEYwclZ"
+ ],
+ "title": "Running a development build",
+ "prefix": null,
+ "dataFileName": "Running a development build.clone.md",
+ "type": "text",
+ "format": "markdown",
+ "isExpanded": false
}
]
},
diff --git a/docs/Developer Guide/Developer Guide/Project Structure/CKEditor.md b/docs/Developer Guide/Developer Guide/Project Structure/CKEditor.md
new file mode 100644
index 000000000..a1c1902dc
--- /dev/null
+++ b/docs/Developer Guide/Developer Guide/Project Structure/CKEditor.md
@@ -0,0 +1,6 @@
+# CKEditor
+* We migrated away from the legacy CKEditor builds using Webpack and instead use the prebuilt npm binaries.
+* The role of the `packages/ckeditor5` is to gather the CKEditor for consumption by the client, which includes plugin definitions.
+* The internal Trilium plugins (e.g. cut to note, include note) are present in `packages/ckeditor5/src/plugins`.
+* External CKEditor plugins that needed adjustments are present in `packages/ckeditor5-*`.
+ * To integrate a new plugin, see Plugin migration guide.
\ No newline at end of file
diff --git a/docs/Developer Guide/Developer Guide/Project Structure/CKEditor/Plugin migration guide.md b/docs/Developer Guide/Developer Guide/Project Structure/CKEditor/Plugin migration guide.md
new file mode 100644
index 000000000..e92e4d181
--- /dev/null
+++ b/docs/Developer Guide/Developer Guide/Project Structure/CKEditor/Plugin migration guide.md
@@ -0,0 +1,84 @@
+# Plugin migration guide
+This guide walks through the basic steps to take to integrate a CKEditor 5 plugin for use inside the Trilium monorepo, which allows:
+
+* Making modifications to the implementation without having to maintain a new repo.
+* Integrating an older plugin based on the legacy installation method so that it works well with the new one.
+
+> [!IMPORTANT]
+> This guide assumes that the CKEditor plugin is written in TypeScript. If it isn't, then you will have to port it to TypeScript to match the rest of the monorepo.
+
+## Step 1. Creating the project skeleton
+
+First, we are going to generate a project from scratch so that it picks up the latest template for building CKEditor plugins, whereas the plugin which is being integrated might be based on the legacy method.
+
+Outside the `Notes` repository, we are going to use the CKEditor generator to generate the new project structure for us. We are not doing it directly inside `Notes` repository since it's going to use a different package manager (Yarn/NPM vs `pnpm`) and it also creates its own Git repository.
+
+```
+npx ckeditor5-package-generator @triliumnext/ckeditor5-foo --use-npm --lang ts --installation-methods current
+```
+
+Of course, replace `foo` with the name of the plugin. Generally it's better to stick with the original name of the plugin which can be determined by looking at the prefix of file names (e.g. `mermaid` from `mermaidui` or `mermaidediting`).
+
+## Step 2. Copy the new project
+
+1. Go to the newly created `ckeditor5-foo` directory.
+2. Remove `node_modules` since we are going to use `pnpm` to handle it.
+3. Remove `.git` from it.
+4. Copy the folder into the `Notes` repo, as a subdirectory of `packages`.
+
+## Step 3. Updating dependencies
+
+In the newly copied package, go to `package.json` and edit:
+
+1. In `devDependencies`, change `ckeditor5` from `latest` to the same version as the one described in `packages/ckeditor5/package.json` (fixed version, e.g. `43.2.0`).
+2. In `peerDependencies`, change `ckeditor5` to the same version as from the previous step.
+3. Similarly, update `vitest` dependencies to match the monorepo one.
+4. Remove the `prepare` entry from the `scripts` section.
+5. Change `build:dist` to simply `build` in order to integrate it with NX.
+
+## Step 4. Install missing dependencies and build errors
+
+Run `pnpm build-dist` on the `Notes` root, and:
+
+1. If there is an error about `Invalid module name in augmentation, module '@ckeditor/ckeditor5-core' cannot be found.`, simply replace `@ckeditor/ckeditor5-core` with `ckeditor5`.
+2. Run the build command again and ensure there are no build errors.
+3. Commit the changes.
+
+## Step 5. Using `git subtree` to pull in the original repo
+
+Instead of copying the files from the existing plugin we are actually going to carry over the history for traceability. To do so, we will use a temporary directory inside the repo:
+
+```
+git subtree add --prefix=_regroup/ https://[...]/repo.git
+```
+
+This will bring in all the commits of the upstream repo from the provided branch and rewrite them to be placed under the desired directory.
+
+## Step 6. Integrate the plugin
+
+1. Start by copying each sub-plugin (except the main one such as `FooEditing` and `FooUI`).
+ 1. If they are written in JavaScript, port them to TypeScript.
+ 1. Remove any non-TypeScript type documentation.
+ 2. If they have non-standard imports to CKEditor, such as `'ckeditor5/src/core.js'`, rewrite them to simply `ckeditor`.
+2. Install any necessary dependencies used by the source code (try going based on compilation errors rather than simply copying over all dependencies from `package.json`).
+3. Keep the existing TypeScript files that were generated automatically and integrate the changes into them.
+4. In `tsconfig.json` of the plugin, set `compilerOptions.composite` to `true`.
+5. Add a workspace dependency to the new plugin in `packages/ckeditor5/package.json`.
+6. In `packages/ckeditor5` look for `plugins.ts` and import the top-level plugin in `EXTERNAL_PLUGINS`.
+
+## Handling CSS
+
+Some plugins have custom CSS whereas some don't.
+
+1. `import` the CSS in the `index.ts` of the plugin.
+2. When building the plugin, `dist/index.css` will be updated.
+3. In `plugins.ts` from `packages/ckeditor5`, add an import to the CSS.
+
+## Integrating from another monorepo
+
+This is a more complicated use-case if the upstream plugin belongs to a monorepo of another project (similar to how `trilium-ckeditor5` used to be).
+
+1. Create a fresh Git clone of the upstream monorepo to obtain the plugin from.
+2. Run `git filter-repo --path packages/ckeditor5-foo/` (the trailing slash is very important!).
+3. Run `git subtree add` just like in the previous steps but point to the local Git directory instead (by appending `/.git` to the absolute path of the repository).
+4. Follow same integration steps as normal.
\ No newline at end of file
diff --git a/docs/User Guide/!!!meta.json b/docs/User Guide/!!!meta.json
index 22a9fa6ec..2a19d33a0 100644
--- a/docs/User Guide/!!!meta.json
+++ b/docs/User Guide/!!!meta.json
@@ -5090,25 +5090,25 @@
"mime": "text/html",
"attributes": [
{
- "type": "label",
- "name": "iconClass",
- "value": "bx bx-bookmark",
+ "type": "relation",
+ "name": "internalLink",
+ "value": "QEAPj01N5f7w",
"isInheritable": false,
"position": 10
},
{
"type": "relation",
"name": "internalLink",
- "value": "QEAPj01N5f7w",
+ "value": "nRhnJkTT8cPs",
"isInheritable": false,
"position": 20
},
{
- "type": "relation",
- "name": "internalLink",
- "value": "nRhnJkTT8cPs",
+ "type": "label",
+ "name": "iconClass",
+ "value": "bx bx-bookmark",
"isInheritable": false,
- "position": 30
+ "position": 10
}
],
"format": "markdown",
@@ -6013,44 +6013,44 @@
{
"type": "relation",
"name": "internalLink",
- "value": "s1aBHPd79XYj",
+ "value": "oSuaNgyyKnhu",
"isInheritable": false,
"position": 20
},
{
"type": "relation",
"name": "internalLink",
- "value": "nBAXQFj20hS1",
+ "value": "s1aBHPd79XYj",
"isInheritable": false,
"position": 30
},
{
"type": "relation",
"name": "internalLink",
- "value": "NRnIZmSMc5sj",
+ "value": "nBAXQFj20hS1",
"isInheritable": false,
"position": 40
},
{
"type": "relation",
"name": "internalLink",
- "value": "YfYAtQBcfo5V",
+ "value": "NRnIZmSMc5sj",
"isInheritable": false,
"position": 50
},
+ {
+ "type": "relation",
+ "name": "internalLink",
+ "value": "YfYAtQBcfo5V",
+ "isInheritable": false,
+ "position": 60
+ },
{
"type": "label",
"name": "iconClass",
"value": "bx bx-plus",
"isInheritable": false,
"position": 60
- },
- {
- "type": "relation",
- "name": "internalLink",
- "value": "oSuaNgyyKnhu",
- "isInheritable": false,
- "position": 70
}
],
"format": "markdown",
@@ -6455,23 +6455,23 @@
{
"type": "relation",
"name": "internalLink",
- "value": "dEHYtoWWi8ct",
+ "value": "CohkqWQC1iBv",
"isInheritable": false,
"position": 70
},
+ {
+ "type": "relation",
+ "name": "internalLink",
+ "value": "dEHYtoWWi8ct",
+ "isInheritable": false,
+ "position": 80
+ },
{
"type": "label",
"name": "iconClass",
"value": "bx bxl-markdown",
"isInheritable": false,
"position": 70
- },
- {
- "type": "relation",
- "name": "internalLink",
- "value": "CohkqWQC1iBv",
- "isInheritable": false,
- "position": 80
}
],
"format": "markdown",
button in the Formatting toolbar,
+ 
button.
-
-
button will reveal a popup window displaying a list of characters that
- are generally more difficult to insert directly from the keyboard, such
- as a subset of emojis, quotation characters, etc.
button to create an inline Mermaid diagram.
-
button in the Formatting toolbar.
-
-
in the formatting toolbar.
button from the Formatting toolbar (generally
found under the Insert buttons).