mirror of
https://github.com/zadam/trilium.git
synced 2026-03-22 00:03:41 +01:00
chore(mermaid): add a bottom section for switching between samples
This commit is contained in:
parent
25cf23f507
commit
ce71068f6d
9
apps/client/src/widgets/layout/NoteContentSwitcher.tsx
Normal file
9
apps/client/src/widgets/layout/NoteContentSwitcher.tsx
Normal file
@ -0,0 +1,9 @@
|
||||
import { ComponentChildren } from "preact";
|
||||
|
||||
interface NoteContentSwitcherProps {
|
||||
children: ComponentChildren;
|
||||
}
|
||||
|
||||
export default function NoteContentSwitcher({ children }: NoteContentSwitcherProps) {
|
||||
return <p>{children}</p>;
|
||||
}
|
||||
@ -1,7 +1,9 @@
|
||||
import { useCallback } from "preact/hooks";
|
||||
|
||||
import { getMermaidConfig, loadElkIfNeeded, postprocessMermaidSvg } from "../../services/mermaid";
|
||||
import NoteContentSwitcher from "../layout/NoteContentSwitcher";
|
||||
import SvgSplitEditor from "./helpers/SvgSplitEditor";
|
||||
import { TypeWidgetProps } from "./type_widget";
|
||||
import { getMermaidConfig, loadElkIfNeeded, postprocessMermaidSvg } from "../../services/mermaid";
|
||||
|
||||
let idCounter = 1;
|
||||
let registeredErrorReporter = false;
|
||||
@ -30,6 +32,11 @@ export default function Mermaid(props: TypeWidgetProps) {
|
||||
attachmentName="mermaid-export"
|
||||
renderSvg={renderSvg}
|
||||
noteType="mermaid"
|
||||
extraContent={(
|
||||
<NoteContentSwitcher>
|
||||
Foo
|
||||
</NoteContentSwitcher>
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
|
||||
@ -19,6 +19,7 @@ export interface SplitEditorProps extends EditableCodeProps {
|
||||
previewButtons?: ComponentChildren;
|
||||
editorBefore?: ComponentChildren;
|
||||
forceOrientation?: "horizontal" | "vertical";
|
||||
extraContent?: ComponentChildren;
|
||||
}
|
||||
|
||||
/**
|
||||
@ -41,7 +42,7 @@ export default function SplitEditor(props: SplitEditorProps) {
|
||||
|
||||
}
|
||||
|
||||
function EditorWithSplit({ note, error, splitOptions, previewContent, previewButtons, className, editorBefore, forceOrientation, ...editorProps }: SplitEditorProps) {
|
||||
function EditorWithSplit({ note, error, splitOptions, previewContent, previewButtons, className, editorBefore, forceOrientation, extraContent, ...editorProps }: SplitEditorProps) {
|
||||
const containerRef = useRef<HTMLDivElement>(null);
|
||||
const splitEditorOrientation = useSplitOrientation(forceOrientation);
|
||||
|
||||
@ -57,9 +58,12 @@ function EditorWithSplit({ note, error, splitOptions, previewContent, previewBut
|
||||
{...editorProps}
|
||||
/>
|
||||
</div>
|
||||
{error && <Admonition type="caution" className="note-detail-error-container">
|
||||
{error}
|
||||
</Admonition>}
|
||||
{error && (
|
||||
<Admonition type="caution" className="note-detail-error-container">
|
||||
{error}
|
||||
</Admonition>
|
||||
)}
|
||||
{extraContent}
|
||||
</div>
|
||||
);
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user