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): add more options to canvas

Browse Source
This commit is contained in:
Elian Doran 2025-09-22 08:40:56 +03:00
parent 592a8b2232
commit 8c85aa343c
No known key found for this signature in database
2 changed files with 21 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
apps/client/src/widgets/type_widgets/Canvas.tsx
View File

@ -2,18 +2,21 @@ import { Excalidraw } from "@excalidraw/excalidraw";
import { TypeWidgetProps } from "./type_widget";
import "@excalidraw/excalidraw/index.css";
import { useNoteBlob } from "../react/hooks";
import { useEffect, useRef } from "preact/hooks";
import type { ExcalidrawImperativeAPI, Theme } from "@excalidraw/excalidraw/types";
import { useEffect, useMemo, useRef } from "preact/hooks";
import type { ExcalidrawImperativeAPI, AppState } from "@excalidraw/excalidraw/types";
import options from "../../services/options";
import "./Canvas.css";
export default function Canvas({ note }: TypeWidgetProps) {
const apiRef = useRef<ExcalidrawImperativeAPI>(null);
const blob = useNoteBlob(note);
const viewModeEnabled = options.is("databaseReadonly");
const themeStyle = useMemo(() => {
const documentStyle = window.getComputedStyle(document.documentElement);
return documentStyle.getPropertyValue("--theme-style")?.trim() as AppState["theme"];
}, []);
useEffect(() => {
const documentStyle = window.getComputedStyle(document.documentElement);
const themeStyle = documentStyle.getPropertyValue("--theme-style")?.trim() as Theme;
const api = apiRef.current;
const content = blob?.content;
if (!api) return;
@ -33,6 +36,19 @@ export default function Canvas({ note }: TypeWidgetProps) {
<div className="excalidraw-wrapper">
<Excalidraw
excalidrawAPI={api => apiRef.current = api}
theme={themeStyle}
viewModeEnabled={viewModeEnabled}
zenModeEnabled={false}
isCollaborating={false}
detectScroll={false}
handleKeyboardGlobally={false}
autoFocus={false}
UIOptions={{
canvasActions: {
saveToActiveFile: false,
export: false
}
}}
/>
</div>
</div>

13
apps/client/src/widgets/type_widgets_old/canvas.ts
View File

@ -134,20 +134,7 @@ export default class ExcalidrawTypeWidget extends TypeWidget {
const Canvas = (await import("./canvas_el.js")).default;
this.canvasInstance = new Canvas({
// this makes sure that 1) manual theme switch button is hidden 2) theme stays as it should after opening menu
theme: this.themeStyle,
onChange: () => this.onChangeHandler(),
viewModeEnabled: options.is("databaseReadonly"),
zenModeEnabled: false,
isCollaborating: false,
detectScroll: false,
handleKeyboardGlobally: false,
autoFocus: false,
UIOptions: {
canvasActions: {
saveToActiveFile: false,
export: false
}
},
onLibraryChange: () => {
this.libraryChanged = true;