mirror of https://github.com/halo-dev/halo
pref: optimize code block backspace shortcut key logic (#5936)
#### What type of PR is this? /kind improvement /area editor /milestone 2.16.x #### What this PR does / why we need it: 优化默认编辑器代码块 `Backspace` 快捷键逻辑。如下所示: 1. 选中内容时进行删除,保证光标仍处于代码块内。 2. 光标处于代码块首位或者代码块没有内容时,不再删除代码块。 #### How to test it? 测试默认编辑器代码块功能。查看是否符合上述逻辑 #### Which issue(s) this PR fixes: Fixes #5927 #### Does this PR introduce a user-facing change? ```release-note 优化默认编辑器代码块 Backspace 快捷键逻辑 ```pull/5965/head
parent
d29a377bbd
commit
b762a9dac7
|
@ -5,6 +5,7 @@ import {
|
||||||
isActive,
|
isActive,
|
||||||
findParentNode,
|
findParentNode,
|
||||||
VueNodeViewRenderer,
|
VueNodeViewRenderer,
|
||||||
|
isNodeActive,
|
||||||
} from "@/tiptap/vue-3";
|
} from "@/tiptap/vue-3";
|
||||||
import {
|
import {
|
||||||
EditorState,
|
EditorState,
|
||||||
|
@ -130,6 +131,32 @@ export default CodeBlockLowlight.extend<
|
||||||
},
|
},
|
||||||
addKeyboardShortcuts() {
|
addKeyboardShortcuts() {
|
||||||
return {
|
return {
|
||||||
|
Backspace: ({ editor }) => {
|
||||||
|
if (!isNodeActive(editor.state, this.name)) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { selection } = editor.state;
|
||||||
|
// Clear the selected content and adapt to the all-select shortcut key operation.
|
||||||
|
if (!selection.empty) {
|
||||||
|
editor
|
||||||
|
.chain()
|
||||||
|
.focus()
|
||||||
|
.deleteSelection()
|
||||||
|
.setTextSelection(selection.$from.pos)
|
||||||
|
.run();
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { $anchor } = selection;
|
||||||
|
const isAtStart = $anchor.parentOffset === 0;
|
||||||
|
// If the cursor is at the beginning of the code block or the code block is empty, it is not deleted.
|
||||||
|
if (isAtStart || !$anchor.parent.textContent.length) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
},
|
||||||
Tab: () => {
|
Tab: () => {
|
||||||
if (this.editor.isActive("codeBlock")) {
|
if (this.editor.isActive("codeBlock")) {
|
||||||
return this.editor.chain().focus().codeIndent().run();
|
return this.editor.chain().focus().codeIndent().run();
|
||||||
|
|
Loading…
Reference in New Issue