feat: add the clear format function to the default editor

ui/packages/editor/src/dev/App.vue

@@ -45,6 +45,7 @@ import {
   ExtensionTrailingNode,
   ExtensionListKeymap,
   ExtensionSearchAndReplace,
+  ExtensionClearFormat,
 } from "../index";
 
 const content = useLocalStorage("content", "");
@@ -111,6 +112,7 @@ const editor = useEditor({
     ExtensionTrailingNode,
     ExtensionListKeymap,
     ExtensionSearchAndReplace,
+    ExtensionClearFormat,
   ],
   parseOptions: {
     preserveWhitespace: true,

ui/packages/editor/src/extensions/clear-format/index.ts

@@ -0,0 +1,35 @@
+import { Extension } from "@/tiptap";
+import type { ExtensionOptions } from "@/types";
+import type { Editor } from "@/tiptap";
+import { markRaw } from "vue";
+import IconParkSolidClearFormat from "~icons/icon-park-solid/clear-format";
+import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
+import { i18n } from "@/locales";
+
+const clearFormat = Extension.create<ExtensionOptions>({
+  addOptions() {
+    return {
+      getToolbarItems({ editor }: { editor: Editor }) {
+        return {
+          priority: 23,
+          component: markRaw(ToolbarItem),
+          props: {
+            editor,
+            isActive: false,
+            icon: markRaw(IconParkSolidClearFormat),
+            title: i18n.global.t("editor.common.clear_format"),
+            action: () => editor.chain().focus().unsetAllMarks().run(),
+          },
+        };
+      },
+    };
+  },
+
+  addKeyboardShortcuts() {
+    return {
+      "Mod-\\": () => this.editor.chain().focus().unsetAllMarks().run(),
+    };
+  },
+});
+
+export default clearFormat;

ui/packages/editor/src/extensions/index.ts

@@ -43,6 +43,7 @@ import ExtensionDraggable from "./draggable";
 import ExtensionNodeSelected from "./node-selected";
 import ExtensionTrailingNode from "./trailing-node";
 import ExtensionSearchAndReplace from "./search-and-replace";
+import ExtensionClearFormat from "./clear-format";
 
 const allExtensions = [
   ExtensionBlockquote,
@@ -100,6 +101,7 @@ const allExtensions = [
   ExtensionNodeSelected,
   ExtensionTrailingNode,
   ExtensionSearchAndReplace,
+  ExtensionClearFormat,
 ];
 
 export {
@@ -147,4 +149,5 @@ export {
   ExtensionTrailingNode,
   ExtensionListKeymap,
   ExtensionSearchAndReplace,
+  ExtensionClearFormat,
 };

ui/packages/editor/src/locales/en.yaml

@@ -26,7 +26,7 @@ editor:
       audio: Audio
       table: Table
       no_results: No results
-      placeholder: "Enter / to select input type"
+      placeholder: Enter / to select input type
     link:
       add_link: Add link
       edit_link: Edit link
@@ -131,3 +131,4 @@ editor:
       restore_default: Restore default
     text:
       default: Default
+    clear_format: Clear format

ui/packages/editor/src/locales/zh-CN.yaml

@@ -131,3 +131,4 @@ editor:
       restore_default: 恢复为默认
     text:
       default: 默认
+    clear_format: 清除格式