gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2026-01-07 15:14:24 +01:00
Code Issues Actions 12 Packages Projects Releases Wiki Activity

chore(highlights_list): reintroduce navigation

Browse Source
This commit is contained in:
Elian Doran 2025-12-18 13:09:53 +02:00
parent 73f2f56932
commit 7085e62cfc
No known key found for this signature in database
2 changed files with 24 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
apps/client/src/widgets/sidebar/HighlightsList.tsx
View File

@ -1,5 +1,5 @@
import { CKTextEditor, ModelTextProxy } from "@triliumnext/ckeditor5";
import { useEffect, useState } from "preact/hooks";
import { CKTextEditor, ModelText } from "@triliumnext/ckeditor5";
import { useCallback, useEffect, useState } from "preact/hooks";
import { t } from "../../services/i18n";
import { useActiveNoteContext, useIsNoteReadOnly, useNoteProperty, useTextEditor } from "../react/hooks";
@ -24,14 +24,15 @@ export default function HighlightsList() {
);
}
function AbstractHighlightsList({ highlights }: {
highlights: RawHighlight[]
function AbstractHighlightsList<T extends RawHighlight>({ highlights, scrollToHighlight }: {
highlights: T[],
scrollToHighlight(highlight: T): void;
}) {
return (
<span className="highlights-list">
<ol>
{highlights.map(highlight => (
<li>
<li onClick={() => scrollToHighlight(highlight)}>
<span>{highlight.text}</span>
</li>
))}
@ -42,7 +43,8 @@ function AbstractHighlightsList({ highlights }: {
//#region Editable text (CKEditor)
interface CKHighlight extends RawHighlight {
element: ModelTextProxy;
textNode: ModelText;
offset: number | null;
}
function EditableTextHighlightsList() {
@ -57,8 +59,21 @@ function EditableTextHighlightsList() {
setHighlights(highlights);
}, [ textEditor, note ]);
const scrollToHeading = useCallback((highlight: CKHighlight) => {
if (!textEditor) return;
const modelPos = textEditor.model.createPositionAt(highlight.textNode, "before");
const viewPos = textEditor.editing.mapper.toViewPosition(modelPos);
const domConverter = textEditor.editing.view.domConverter;
const domPos = domConverter.viewPositionToDom(viewPos);
if (!domPos) return;
(domPos.parent as HTMLElement).scrollIntoView();
}, [ textEditor ]);
return <AbstractHighlightsList
highlights={highlights}
scrollToHighlight={scrollToHeading}
/>;
}
@ -85,7 +100,8 @@ function extractHighlightsFromTextEditor(editor: CKTextEditor) {
id: crypto.randomUUID(),
text: item.data,
attrs,
element: item
textNode: item.textNode,
offset: item.startOffset
});
}
}

2
packages/ckeditor5/src/index.ts
View File

@ -6,7 +6,7 @@ import { BalloonEditor, DecoupledEditor, FindAndReplaceEditing, FindCommand } fr
import "./translation_overrides.js";
export { default as EditorWatchdog } from "./custom_watchdog";
export { PREMIUM_PLUGINS } from "./plugins.js";
export type { EditorConfig, MentionFeed, MentionFeedObjectItem, ModelNode, ModelPosition, ModelElement, ModelTextProxy, WatchdogConfig, WatchdogState } from "ckeditor5";
export type { EditorConfig, MentionFeed, MentionFeedObjectItem, ModelNode, ModelPosition, ModelElement, ModelText, WatchdogConfig, WatchdogState } from "ckeditor5";
export type { TemplateDefinition } from "ckeditor5-premium-features";
export { default as buildExtraCommands } from "./extra_slash_commands.js";
export { default as getCkLocale } from "./i18n.js";