mirror of
https://github.com/BookStackApp/BookStack.git
synced 2024-12-11 20:54:38 +08:00
81 lines
2.6 KiB
TypeScript
81 lines
2.6 KiB
TypeScript
|
import {EditorButton, EditorButtonDefinition} from "../../framework/buttons";
|
||
|
import undoIcon from "@icons/editor/undo.svg";
|
||
|
import {EditorUiContext} from "../../framework/core";
|
||
|
import {
|
||
|
BaseSelection,
|
||
|
CAN_REDO_COMMAND,
|
||
|
CAN_UNDO_COMMAND,
|
||
|
COMMAND_PRIORITY_LOW,
|
||
|
REDO_COMMAND,
|
||
|
UNDO_COMMAND
|
||
|
} from "lexical";
|
||
|
import redoIcon from "@icons/editor/redo.svg";
|
||
|
import sourceIcon from "@icons/editor/source-view.svg";
|
||
|
import {getEditorContentAsHtml} from "../../../actions";
|
||
|
import fullscreenIcon from "@icons/editor/fullscreen.svg";
|
||
|
|
||
|
export const undo: EditorButtonDefinition = {
|
||
|
label: 'Undo',
|
||
|
icon: undoIcon,
|
||
|
action(context: EditorUiContext) {
|
||
|
context.editor.dispatchCommand(UNDO_COMMAND, undefined);
|
||
|
},
|
||
|
isActive(selection: BaseSelection|null): boolean {
|
||
|
return false;
|
||
|
},
|
||
|
setup(context: EditorUiContext, button: EditorButton) {
|
||
|
button.toggleDisabled(true);
|
||
|
|
||
|
context.editor.registerCommand(CAN_UNDO_COMMAND, (payload: boolean): boolean => {
|
||
|
button.toggleDisabled(!payload)
|
||
|
return false;
|
||
|
}, COMMAND_PRIORITY_LOW);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
export const redo: EditorButtonDefinition = {
|
||
|
label: 'Redo',
|
||
|
icon: redoIcon,
|
||
|
action(context: EditorUiContext) {
|
||
|
context.editor.dispatchCommand(REDO_COMMAND, undefined);
|
||
|
},
|
||
|
isActive(selection: BaseSelection|null): boolean {
|
||
|
return false;
|
||
|
},
|
||
|
setup(context: EditorUiContext, button: EditorButton) {
|
||
|
button.toggleDisabled(true);
|
||
|
|
||
|
context.editor.registerCommand(CAN_REDO_COMMAND, (payload: boolean): boolean => {
|
||
|
button.toggleDisabled(!payload)
|
||
|
return false;
|
||
|
}, COMMAND_PRIORITY_LOW);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
|
||
|
export const source: EditorButtonDefinition = {
|
||
|
label: 'Source code',
|
||
|
icon: sourceIcon,
|
||
|
async action(context: EditorUiContext) {
|
||
|
const modal = context.manager.createModal('source');
|
||
|
const source = await getEditorContentAsHtml(context.editor);
|
||
|
modal.show({source});
|
||
|
},
|
||
|
isActive() {
|
||
|
return false;
|
||
|
}
|
||
|
};
|
||
|
|
||
|
export const fullscreen: EditorButtonDefinition = {
|
||
|
label: 'Fullscreen',
|
||
|
icon: fullscreenIcon,
|
||
|
async action(context: EditorUiContext, button: EditorButton) {
|
||
|
const isFullScreen = context.containerDOM.classList.contains('fullscreen');
|
||
|
context.containerDOM.classList.toggle('fullscreen', !isFullScreen);
|
||
|
(context.containerDOM.closest('body') as HTMLElement).classList.toggle('editor-is-fullscreen', !isFullScreen);
|
||
|
button.setActiveState(!isFullScreen);
|
||
|
},
|
||
|
isActive(selection, context: EditorUiContext) {
|
||
|
return context.containerDOM.classList.contains('fullscreen');
|
||
|
}
|
||
|
};
|