60 lines
1.3 KiB
TypeScript
60 lines
1.3 KiB
TypeScript
import type { SvelteComponent } from "svelte";
|
|
import { checkNightMode } from "anki/nightmode";
|
|
import EditorToolbarSvelte from "./EditorToolbar.svelte";
|
|
|
|
import LabelButton from "./LabelButton.svelte";
|
|
|
|
import {
|
|
boldButton,
|
|
italicButton,
|
|
underlineButton,
|
|
superscriptButton,
|
|
subscriptButton,
|
|
eraserButton,
|
|
} from "./format";
|
|
|
|
import { forecolorButton, colorpickerButton } from "./color";
|
|
|
|
import {
|
|
attachmentButton,
|
|
recordButton,
|
|
clozeButton,
|
|
mathjaxButton,
|
|
htmlButton,
|
|
} from "./extra";
|
|
|
|
const defaultButtons = [
|
|
[
|
|
{ component: LabelButton, label: "Fields..." },
|
|
{ component: LabelButton, label: "Cards..." },
|
|
],
|
|
[
|
|
boldButton,
|
|
italicButton,
|
|
underlineButton,
|
|
superscriptButton,
|
|
subscriptButton,
|
|
eraserButton,
|
|
],
|
|
[forecolorButton, colorpickerButton],
|
|
[attachmentButton, recordButton, clozeButton, mathjaxButton, htmlButton],
|
|
];
|
|
|
|
class EditorToolbar extends HTMLElement {
|
|
component?: SvelteComponent;
|
|
|
|
connectedCallback(): void {
|
|
const nightMode = checkNightMode();
|
|
|
|
this.component = new EditorToolbarSvelte({
|
|
target: this,
|
|
props: {
|
|
nightMode,
|
|
buttons: defaultButtons,
|
|
},
|
|
});
|
|
}
|
|
}
|
|
|
|
customElements.define("anki-editor-toolbar", EditorToolbar);
|