gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-11 17:08:58 +01:00
Code Issues Actions 12 Packages Projects Releases Wiki Activity

chore(react/type_widget): disable code background change in split

Browse Source
This commit is contained in:
Elian Doran 2025-09-20 14:16:34 +03:00
parent bde7b753a0
commit 3dd757a857
No known key found for this signature in database
3 changed files with 9 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
apps/client/src/widgets/type_widgets/code/Code.tsx
View File

@ -12,7 +12,12 @@ import keyboard_actions from "../../../services/keyboard_actions";
import { refToJQuerySelector } from "../../react/react_utils"; import { refToJQuerySelector } from "../../react/react_utils";
import { CODE_THEME_DEFAULT_PREFIX as DEFAULT_PREFIX } from "../constants"; import { CODE_THEME_DEFAULT_PREFIX as DEFAULT_PREFIX } from "../constants";
export interface EditableCodeProps extends TypeWidgetProps { interface CodeEditorProps {
/** By default, the code editor will try to match the color of the scrolling container to match the one from the theme for a full-screen experience. If the editor is embedded, it makes sense not to have this behaviour. */
noBackgroundChange?: boolean;
}
export interface EditableCodeProps extends TypeWidgetProps, Omit<CodeEditorProps, "onContentChanged"> {
// if true, the update will be debounced to prevent excessive updates. Especially useful if the editor is linked to a live preview. // if true, the update will be debounced to prevent excessive updates. Especially useful if the editor is linked to a live preview.
debounceUpdate?: boolean; debounceUpdate?: boolean;
lineWrapping?: boolean; lineWrapping?: boolean;
@ -101,7 +106,7 @@ export function EditableCode({ note, ntxId, debounceUpdate, parentComponent, upd
) )
} }
export function CodeEditor({ parentComponent, ntxId, containerRef: externalContainerRef, editorRef: externalEditorRef, mime, onInitialized, lineWrapping, ...editorProps }: Omit<CodeMirrorProps, "onThemeChange"> & Pick<TypeWidgetProps, "parentComponent" | "ntxId">) { export function CodeEditor({ parentComponent, ntxId, containerRef: externalContainerRef, editorRef: externalEditorRef, mime, onInitialized, lineWrapping, noBackgroundChange, ...editorProps }: CodeEditorProps & CodeMirrorProps & Pick<TypeWidgetProps, "parentComponent" | "ntxId">) {
const codeEditorRef = useRef<VanillaCodeMirror>(null); const codeEditorRef = useRef<VanillaCodeMirror>(null);
const containerRef = useSyncedRef(externalContainerRef); const containerRef = useSyncedRef(externalContainerRef);
const initialized = useRef($.Deferred()); const initialized = useRef($.Deferred());
@ -111,7 +116,7 @@ export function CodeEditor({ parentComponent, ntxId, containerRef: externalConta
// React to background color. // React to background color.
const [ backgroundColor, setBackgroundColor ] = useState<string>(); const [ backgroundColor, setBackgroundColor ] = useState<string>();
useEffect(() => { useEffect(() => {
if (!backgroundColor) return; if (!backgroundColor || noBackgroundChange) return;
parentComponent?.$widget.closest(".scrolling-container").css("background-color", backgroundColor); parentComponent?.$widget.closest(".scrolling-container").css("background-color", backgroundColor);
return () => { return () => {
parentComponent?.$widget.closest(".scrolling-container").css("background-color", "unset"); parentComponent?.$widget.closest(".scrolling-container").css("background-color", "unset");

1
apps/client/src/widgets/type_widgets/helpers/SplitEditor.tsx
View File

@ -37,6 +37,7 @@ export default function SplitEditor({ note, error, splitOptions, previewContent,
note={note} note={note}
lineWrapping={false} lineWrapping={false}
updateInterval={750} debounceUpdate updateInterval={750} debounceUpdate
noBackgroundChange
{...editorProps} {...editorProps}
/> />
</div> </div>

20
apps/client/src/widgets/type_widgets_old/mermaid.ts
View File

@ -1,20 +0,0 @@
import type { EditorConfig } from "@triliumnext/codemirror";
import { getMermaidConfig, loadElkIfNeeded, postprocessMermaidSvg } from "../../services/mermaid.js";
import AbstractSvgSplitTypeWidget from "./abstract_svg_split_type_widget.js";
export class MermaidTypeWidget extends AbstractSvgSplitTypeWidget {
static getType() {
return "mermaid";
}
get attachmentName(): string {
return "mermaid-export";
}
async renderSvg(content: string) {
}
}