mirror of
https://github.com/BookStackApp/BookStack.git
synced 2024-12-05 15:53:37 +08:00
16518a4f89
- Updated selection change detection to be more accurate - Added UI refresh for extra actions - Fixed remove link deleting contents
83 lines
2.7 KiB
TypeScript
83 lines
2.7 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 "../../../utils/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);
|
|
context.manager.triggerFutureStateRefresh();
|
|
},
|
|
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);
|
|
context.manager.triggerFutureStateRefresh();
|
|
},
|
|
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');
|
|
}
|
|
}; |