gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-26 02:24:23 +01:00
Code Issues Actions 11 Packages Projects Releases Wiki Activity

fix(type_widgets): double wrapper for read-only text

Browse Source
This commit is contained in:
Elian Doran 2025-11-25 08:31:26 +02:00
parent 7ecdee7a89
commit a398f07f9f
No known key found for this signature in database
2 changed files with 10 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/client/src/widgets/react/RawHtml.tsx
View File

@ -1,8 +1,8 @@
import type { CSSProperties, RefObject } from "preact/compat"; import type { CSSProperties, HTMLProps, RefObject } from "preact/compat";
type HTMLElementLike = string | HTMLElement | JQuery<HTMLElement>; type HTMLElementLike = string | HTMLElement | JQuery<HTMLElement>;
interface RawHtmlProps { interface RawHtmlProps extends Pick<HTMLProps<HTMLElement>, "tabindex" | "dir"> {
className?: string; className?: string;
html?: HTMLElementLike; html?: HTMLElementLike;
style?: CSSProperties; style?: CSSProperties;

15
apps/client/src/widgets/type_widgets/text/ReadOnlyText.tsx
View File

@ -2,7 +2,7 @@ import { useEffect, useMemo, useRef } from "preact/hooks";
import { TypeWidgetProps } from "../type_widget"; import { TypeWidgetProps } from "../type_widget";
import "./ReadOnlyText.css"; import "./ReadOnlyText.css";
import { useNoteBlob, useNoteLabel, useTriliumEvent, useTriliumOptionBool } from "../../react/hooks"; import { useNoteBlob, useNoteLabel, useTriliumEvent, useTriliumOptionBool } from "../../react/hooks";
import RawHtml from "../../react/RawHtml"; import { RawHtmlBlock } from "../../react/RawHtml";
// we load CKEditor also for read only notes because they contain content styles required for correct rendering of even read only notes // we load CKEditor also for read only notes because they contain content styles required for correct rendering of even read only notes
// we could load just ckeditor-content.css but that causes CSS conflicts when both build CSS and this content CSS is loaded at the same time // we could load just ckeditor-content.css but that causes CSS conflicts when both build CSS and this content CSS is loaded at the same time
@ -17,6 +17,7 @@ import TouchBar, { TouchBarButton, TouchBarSpacer } from "../../react/TouchBar";
import appContext from "../../../components/app_context"; import appContext from "../../../components/app_context";
import { applyReferenceLinks } from "./read_only_helper"; import { applyReferenceLinks } from "./read_only_helper";
import { applyInlineMermaid, rewriteMermaidDiagramsInContainer } from "../../../services/content_renderer"; import { applyInlineMermaid, rewriteMermaidDiagramsInContainer } from "../../../services/content_renderer";
import clsx from "clsx";
export default function ReadOnlyText({ note, noteContext, ntxId }: TypeWidgetProps) { export default function ReadOnlyText({ note, noteContext, ntxId }: TypeWidgetProps) {
const blob = useNoteBlob(note); const blob = useNoteBlob(note);
@ -52,14 +53,12 @@ export default function ReadOnlyText({ note, noteContext, ntxId }: TypeWidgetPro
}); });
return ( return (
<div <>
className={`note-detail-readonly-text note-detail-printable ${codeBlockWordWrap ? "word-wrap" : ""}`} <RawHtmlBlock
containerRef={contentRef}
className={clsx("note-detail-readonly-text-content ck-content use-tn-links", codeBlockWordWrap && "word-wrap")}
tabindex={100} tabindex={100}
dir={isRtl ? "rtl" : "ltr"} dir={isRtl ? "rtl" : "ltr"}
>
<RawHtml
containerRef={contentRef}
className="note-detail-readonly-text-content ck-content use-tn-links"
html={blob?.content} html={blob?.content}
/> />
@ -75,7 +74,7 @@ export default function ReadOnlyText({ note, noteContext, ntxId }: TypeWidgetPro
}} }}
/> />
</TouchBar> </TouchBar>
</div> </>
) )
} }