gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-12-20 22:34:23 +01:00
Code Issues Actions 12 Packages Projects Releases Wiki Activity

chore(highlights_list): render highlights

Browse Source
This commit is contained in:
Elian Doran 2025-12-18 13:17:41 +02:00
parent b42a4dcb36
commit d920da9e6f
No known key found for this signature in database
1 changed files with 19 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -8,7 +8,13 @@ import RightPanelWidget from "./RightPanelWidget";
interface RawHighlight { interface RawHighlight {
id: string; id: string;
text: string; text: string;
attrs: Record<string, any>; attrs: {
bold: boolean;
italic: boolean;
underline: boolean;
color: string | undefined;
background: string | undefined;
}
} }
export default function HighlightsList() { export default function HighlightsList() {
@ -33,7 +39,15 @@ function AbstractHighlightsList<T extends RawHighlight>({ highlights, scrollToHi
<ol> <ol>
{highlights.map(highlight => ( {highlights.map(highlight => (
<li onClick={() => scrollToHighlight(highlight)}> <li onClick={() => scrollToHighlight(highlight)}>
<span>{highlight.text}</span> <span
style={{
fontWeight: highlight.attrs.bold ? "700" : undefined,
fontStyle: highlight.attrs.italic ? "italic" : undefined,
textDecoration: highlight.attrs.underline ? "underline" : undefined,
color: highlight.attrs.color,
backgroundColor: highlight.attrs.background
}}
>{highlight.text}</span>
</li> </li>
))} ))}
</ol> </ol>
@ -116,12 +130,12 @@ function extractHighlightsFromTextEditor(editor: CKTextEditor) {
for (const { item } of editor.model.createRangeIn(root).getWalker({ ignoreElementEnd: true })) { for (const { item } of editor.model.createRangeIn(root).getWalker({ ignoreElementEnd: true })) {
if (!item.is('$textProxy')) continue; if (!item.is('$textProxy')) continue;
const attrs = { const attrs: RawHighlight["attrs"] = {
bold: item.hasAttribute('bold'), bold: item.hasAttribute('bold'),
italic: item.hasAttribute('italic'), italic: item.hasAttribute('italic'),
underline: item.hasAttribute('underline'), underline: item.hasAttribute('underline'),
color: item.getAttribute('fontColor'), color: item.getAttribute('fontColor') as string | undefined,
background: item.getAttribute('fontBackgroundColor') background: item.getAttribute('fontBackgroundColor') as string | undefined
}; };
if (Object.values(attrs).some(Boolean)) { if (Object.values(attrs).some(Boolean)) {