vue-editify 0.2.18 → 0.2.19

package/src/core/tool.ts

@@ -1,10 +1,12 @@
-import { App, Component, VNode } from 'vue'
+import { App, Component, Ref, VNode } from 'vue'
+import { AlexEditor, AlexElementsRangeType } from 'alex-editor'
 import { common as DapCommon, string as DapString, color as DapColor, element as DapElement } from 'dap-util'
 import { languages } from '@/hljs'
 import { LocaleType } from '@/locale'
 import { Button, ButtonOptionsItemType, ButtonTypeType } from '@/components/button'
 import { InsertImageUploadErrorType } from '@/components/insertImage'
 import { InsertAttachmentUploadErrorType } from '@/components/insertAttachment'
+import { config as shortcutConfig } from './shortcut'
 
 export type ObjectType = {
 	[key: string]: any
@@ -21,11 +23,18 @@ export type ButtonOptionsConfigType = {
 	backColor?: (string | number | ButtonOptionsItemType)[]
 }
 
+export type ShortcutType = {
+	title: string
+	define: ((event: KeyboardEvent) => boolean | { [code: string]: boolean }) | null
+	operation?: (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, isSourceView: Ref<boolean>, isFullScreen: Ref<boolean>, code?: string) => void
+}
+
 export interface MenuButtonType {
 	show?: boolean
 	leftBorder?: boolean
 	rightBorder?: boolean
 	disabled?: boolean
+	shortcut?: ShortcutType
 }
 
 export interface MenuSelectButtonType extends MenuButtonType {
@@ -88,6 +97,7 @@ export type MenuCustomButtonType = {
 	options?: ButtonOptionsItemType[]
 	value?: string | number
 	hideScroll?: boolean
+	shortcut?: ShortcutType
 	onLayerShow?: (name: string, btnInstance: InstanceType<typeof Button>) => void
 	onLayerShown?: (name: string, btnInstance: InstanceType<typeof Button>) => void
 	onLayerHidden?: (name: string, btnInstance: InstanceType<typeof Button>) => void
@@ -157,7 +167,6 @@ export type MenuSequenceType = {
 	fullScreen?: number
 	attachment?: number
 	mathformula?: number
-	panel?: number
 	infoBlock?: number
 }
 
@@ -205,7 +214,6 @@ export type MenuConfigType = {
 	fullScreen?: MenuButtonType
 	attachment?: MenuAttachmentButtonType
 	mathformula?: MenuMathformulaButtonType
-	panel?: MenuButtonType
 	infoBlock?: MenuButtonType
 	extends?: MenuExtendType
 }
@@ -728,10 +736,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			codeBlock: 27,
 			attachment: 28,
 			mathformula: 29,
-			panel: 30,
-			infoBlock: 31,
-			sourceView: 32,
-			fullScreen: 33
+			infoBlock: 30,
+			sourceView: 31,
+			fullScreen: 32
 		},
 		//撤销按钮配置
 		undo: {
@@ -772,7 +779,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: true,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.heading
 		},
 		//缩进
 		indent: {
@@ -789,7 +798,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.indent
 		},
 		//引用
 		quote: {
@@ -800,7 +811,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.quote
 		},
 		//分隔线
 		separator: {
@@ -811,7 +824,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.separator
 		},
 		//对齐方式
 		align: {
@@ -828,7 +843,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: true,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.align
 		},
 		//有序列表
 		orderList: {
@@ -839,7 +856,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.orderList
 		},
 		//无序列表
 		unorderList: {
@@ -850,7 +869,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.unorderList
 		},
 		//任务列表
 		task: {
@@ -861,7 +882,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.task
 		},
 		//粗体
 		bold: {
@@ -872,7 +895,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: true,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.bold
 		},
 		//下划线
 		underline: {
@@ -883,7 +908,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.underline
 		},
 		//斜体
 		italic: {
@@ -894,7 +921,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.italic
 		},
 		//删除线
 		strikethrough: {
@@ -905,7 +934,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.strikethrough
 		},
 		//行内代码
 		code: {
@@ -916,7 +947,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.code
 		},
 		//上标
 		super: {
@@ -927,7 +960,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.super
 		},
 		//下标
 		sub: {
@@ -938,7 +973,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.sub
 		},
 		//清除格式
 		formatClear: {
@@ -949,7 +986,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.formatClear
 		},
 		//字号
 		fontSize: {
@@ -968,7 +1007,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: true,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.fontSize
 		},
 		//字体
 		fontFamily: {
@@ -987,7 +1028,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.fontFamily
 		},
 		//行高
 		lineHeight: {
@@ -1006,7 +1049,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.lineHeight
 		},
 		//前景色
 		foreColor: {
@@ -1019,7 +1064,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: true,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.foreColor
 		},
 		//背景色
 		backColor: {
@@ -1032,7 +1079,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.backColor
 		},
 		//链接
 		link: {
@@ -1043,7 +1092,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: true,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.link
 		},
 		//图片
 		image: {
@@ -1066,7 +1117,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//自定义上传图片
 			customUpload: undefined,
 			//异常处理函数
-			handleError: undefined
+			handleError: undefined,
+			//快捷键
+			shortcut: shortcutConfig.image
 		},
 		//视频
 		video: {
@@ -1089,7 +1142,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//自定义上传视频
 			customUpload: undefined,
 			//异常处理函数
-			handleError: undefined
+			handleError: undefined,
+			//快捷键
+			shortcut: shortcutConfig.video
 		},
 		//表格
 		table: {
@@ -1104,7 +1159,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//创建时表格的最大行数
 			maxRows: 10,
 			//创建时表格的最大列数
-			maxColumns: 10
+			maxColumns: 10,
+			//快捷键
+			shortcut: shortcutConfig.table
 		},
 		//代码块
 		codeBlock: {
@@ -1115,7 +1172,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.codeBlock
 		},
 		//代码视图
 		sourceView: {
@@ -1126,7 +1185,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.sourceView
 		},
 		//全屏
 		fullScreen: {
@@ -1137,7 +1198,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.fullScreen
 		},
 		//附件
 		attachment: {
@@ -1162,7 +1225,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//自定义上传附件
 			customUpload: undefined,
 			//异常处理函数
-			handleError: undefined
+			handleError: undefined,
+			//快捷键
+			shortcut: shortcutConfig.attachment
 		},
 		//数学公式
 		mathformula: {
@@ -1175,18 +1240,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//右侧边框是否显示
 			rightBorder: false,
 			//异常处理函数
-			handleError: undefined
-		},
-		//面板
-		panel: {
-			//是否显示此按钮
-			show: false,
-			//是否禁用此按钮
-			disabled: false,
-			//左侧边框是否显示
-			leftBorder: false,
-			//右侧边框是否显示
-			rightBorder: false
+			handleError: undefined,
+			//快捷键
+			shortcut: shortcutConfig.mathformula
 		},
 		//信息块
 		infoBlock: {
@@ -1197,7 +1253,9 @@ export const getMenuConfig = (editTrans: (key: string) => any, editLocale: Local
 			//左侧边框是否显示
 			leftBorder: false,
 			//右侧边框是否显示
-			rightBorder: false
+			rightBorder: false,
+			//快捷键
+			shortcut: shortcutConfig.infoBlock
 		},
 		//拓展菜单
 		extends: {}

package/src/css/var.less

@@ -49,10 +49,6 @@
 	--editify-font-color-disabled: #6d6d6d;
 	//较深的字体颜色（编辑器内容区域字体颜色）
 	--editify-font-color-dark: #fff;
-	//链接字体颜色
-	--editify-font-color-link: #079457;
-	//链接字体悬浮色
-	--editify-font-color-link-dark: #05683d;
 	//边框颜色
 	--editify-border-color: #3e3e3e;
 	//默认背景色
@@ -63,12 +59,6 @@
 	--editify-background-darker: #2c2c2c;
 	//代码块背景色
 	--editify-pre-background: #242424;
-	//反色调字体颜色
-	--editify-reverse-color: #333;
-	//反色调背景色
-	--editify-reverse-background: #f7f8fa;
-	//视频背景色
-	--editify-video-background: #f5f5f5;
 	//代码高亮样式
 	--editify-hljs-color-1: #7765dd;
 	--editify-hljs-color-2: #6a737d;

package/src/editify/editify.less

@@ -477,34 +477,6 @@
 				background: var(--editify-background-darker);
 			}
 		}
-		//面板样式
-		:deep(div[data-editify-panel]) {
-			display: block;
-			position: relative;
-			width: 100%;
-			background-color: var(--editify-background-dark);
-			color: var(--editify-font-color);
-			border-radius: 4px;
-			margin-bottom: 15px;
-			padding: 10px 10px 1px 10px;
-			border: 1px solid var(--editify-border-color);
-
-			& > div {
-				margin: 0 0 10px 0;
-				font-size: var(--editify-font-size);
-
-				&:first-child {
-					margin: 0 0 15px 0;
-					font-size: 18px;
-					border-bottom: 1px solid var(--editify-border-color);
-					padding-bottom: 8px;
-
-					&:empty {
-						background-color: #000;
-					}
-				}
-			}
-		}
 		//信息块样式
 		:deep(div[data-editify-info]) {
 			display: block;
@@ -526,7 +498,7 @@
 				display: flex;
 				justify-content: center;
 				align-items: center;
-				content: '\e610';
+				content: '\e600';
 				font-family: 'editify-icon' !important;
 				font-size: 1.25em;
 				padding: 0 20px;

package/src/editify/editify.vue

@@ -22,9 +22,9 @@
 import { computed, getCurrentInstance, nextTick, onBeforeUnmount, onMounted, provide, ref, watch } from 'vue'
 import { AlexEditor, AlexElement, AlexElementRangeType, AlexElementsRangeType } from 'alex-editor'
 import { element as DapElement, event as DapEvent, data as DapData, number as DapNumber, color as DapColor, common as DapCommon } from 'dap-util'
-import { mergeObject, getToolbarConfig, getMenuConfig, MenuConfigType, ObjectType, ToolbarConfigType, clickIsOut } from '@/core/tool'
+import { mergeObject, getToolbarConfig, getMenuConfig, MenuConfigType, ObjectType, ToolbarConfigType, clickIsOut, ShortcutType, MenuExtendType } from '@/core/tool'
 import { listHandle, imageHandle, videoHandle, separatorHandle, linkHandle, codeHandle, tableHandle, preHandle, attachmentHandle, mathformulaHandle, infoBlockHandle, specialInblockHandle } from '@/core/rule'
-import { elementToParagraph, getMatchElementByRange, elementIsTask, elementIsAttachment, elementIsList, elementIsMathformula, getMathformulaByElement, elementIsPanel, elementIsInfoBlock, getMatchElementByElement } from '@/core/function'
+import { elementToParagraph, getMatchElementByRange, elementIsTask, elementIsAttachment, elementIsList, elementIsMathformula, getMathformulaByElement, elementIsInfoBlock, getMatchElementByElement, hasTableInRange, hasPreInRange } from '@/core/function'
 import { trans } from '@/locale'
 import { LanguagesItemType } from '@/hljs'
 import { extraKeepTagsForMathformula } from '@/feature/mathformula'
@@ -629,10 +629,6 @@ const handleCustomHtmlPaste = async (elements: AlexElement[]) => {
 				if (!!getMathformulaByElement(el)) {
 					marks = mergeObject(marks, DapCommon.clone(el.marks!))!
 				}
-				//面板属性保留
-				if (elementIsPanel(el)) {
-					marks['data-editify-panel'] = el.marks!['data-editify-panel']
-				}
 				//信息块属性保留
 				if (elementIsInfoBlock(el)) {
 					marks['data-editify-info'] = el.marks!['data-editify-info']
@@ -741,12 +737,94 @@ const handleCustomParseNode = (ele: AlexElement) => {
 	return ele
 }
 //编辑区域键盘按下
-const handleEditorKeydown = (val: string, e: Event) => {
+const handleEditorKeydown = (val: string, e: KeyboardEvent) => {
 	if (isDisabled.value) {
 		return
 	}
-	//单独按下tab键
-	if ((e as KeyboardEvent).key.toLocaleLowerCase() == 'tab' && !(e as KeyboardEvent).metaKey && !(e as KeyboardEvent).shiftKey && !(e as KeyboardEvent).ctrlKey && !(e as KeyboardEvent).altKey && props.tab) {
+	//遍历菜单栏配置，设置快捷键
+	for (let key in menuConfig.value) {
+		//如果是拓展菜单
+		if (key == 'extends') {
+			//获取拓展菜单列表
+			const extendMenus = (menuConfig.value as any)[key] as MenuExtendType
+			//遍历拓展菜单列表
+			Object.keys(extendMenus).forEach(extendKey => {
+				//获取拓展菜单配置
+				const item = extendMenus[extendKey]
+				//获取该菜单按钮的快捷键配置
+				const shortcut = item.shortcut as ShortcutType | undefined
+				//如果快捷键配置存在并且定义了define方法
+				if (shortcut && typeof shortcut.define == 'function') {
+					//获取define方法执行结果
+					const res = shortcut.define(e) as boolean | { [code: string]: boolean }
+					//如果执行结果是true，则表示该快捷键按下
+					if (res === true) {
+						//阻止默认行为
+						e.preventDefault()
+						//没有被禁用则执行对应的操作
+						if (!item.disabled) {
+							shortcut.operation?.(editor.value!, dataRangeCaches.value, isSourceView, isFullScreen)
+						}
+					}
+					//如果是对象，则表示有多个快捷键操作
+					else if (res && DapCommon.isObject(res)) {
+						//遍历
+						Object.keys(res).forEach(code => {
+							//如果是true，则执行对应的操作
+							if (!!res[code]) {
+								//阻止默认行为
+								e.preventDefault()
+								//没有被禁用则执行对应的操作
+								if (!item.disabled) {
+									shortcut.operation?.(editor.value!, dataRangeCaches.value, isSourceView, isFullScreen, code)
+								}
+							}
+						})
+					}
+				}
+			})
+		}
+		//如果是内置菜单
+		else if (!['use', 'tooltip', 'mode', 'style', 'sequence'].includes(key)) {
+			const item = (menuConfig.value as any)[key]
+			//这里多做一步判断：判断是否菜单并且是否有快捷键配置
+			if (DapCommon.isObject(item) && item.show === true && DapCommon.isObject(item.shortcut)) {
+				//获取该菜单按钮的快捷键配置
+				const shortcut = item.shortcut as ShortcutType
+				//如果定义了define方法
+				if (typeof shortcut.define == 'function') {
+					//获取define方法执行结果
+					const res = shortcut.define(e) as boolean | { [code: string]: boolean }
+					//如果执行结果是true，则表示该快捷键按下
+					if (res === true) {
+						//阻止默认行为
+						e.preventDefault()
+						//没有被禁用则执行对应的操作
+						if (!item.disabled) {
+							shortcut.operation?.(editor.value!, dataRangeCaches.value, isSourceView, isFullScreen)
+						}
+					}
+					//如果是对象，则表示有多个快捷键操作
+					else if (res && DapCommon.isObject(res)) {
+						//遍历
+						Object.keys(res).forEach(code => {
+							//如果是true，则执行对应的操作
+							if (!!res[code]) {
+								//阻止默认行为
+								e.preventDefault()
+								//没有被禁用则执行对应的操作
+								if (!item.disabled) {
+									shortcut.operation?.(editor.value!, dataRangeCaches.value, isSourceView, isFullScreen, code)
+								}
+							}
+						})
+					}
+				}
+			}
+		}
+	}
+	//代码块和表格中单独按下tab键，插入4个空格
+	if (e.key.toLocaleLowerCase() == 'tab' && !e.metaKey && !e.shiftKey && !e.ctrlKey && !e.altKey && (hasTableInRange(editor.value!, dataRangeCaches.value) || hasPreInRange(editor.value!, dataRangeCaches.value))) {
 		e.preventDefault()
 		editor.value!.insertText('    ')
 		editor.value!.domRender()
@@ -971,28 +1049,14 @@ const undo = () => {
 	if (isDisabled.value) {
 		return
 	}
-	const historyRecord = editor.value!.history.get(-1)
-	if (historyRecord) {
-		editor.value!.history.current = historyRecord.current
-		editor.value!.stack = historyRecord.stack
-		editor.value!.range = historyRecord.range
-		editor.value!.domRender(true)
-		editor.value!.rangeRender()
-	}
+	editor.value!.undo()
 }
 //api：重做
 const redo = () => {
 	if (isDisabled.value) {
 		return
 	}
-	const historyRecord = editor.value!.history.get(1)
-	if (historyRecord) {
-		editor.value!.history.current = historyRecord.current
-		editor.value!.stack = historyRecord.stack
-		editor.value!.range = historyRecord.range
-		editor.value!.domRender(true)
-		editor.value!.rangeRender()
-	}
+	editor.value!.redo()
 }
 
 //监听编辑的值变更

package/src/editify/menu/menu.vue

@@ -46,7 +46,6 @@ import { SourceViewMenuButton } from '@/feature/sourceView'
 import { FullScreenMenuButton } from '@/feature/fullScreen'
 import { AttachmentMenuButton } from '@/feature/attachment'
 import { MathformulaMenuButton } from '@/feature/mathformula'
-import { PanelMenuButton } from '@/feature/panel'
 import { InfoBlockMenuButton } from '@/feature/infoBlock'
 
 defineOptions({
@@ -84,7 +83,7 @@ const menuNames = computed<string[]>(() => {
 	})
 })
 //内置菜单组件的数组
-const defaultMenus = shallowRef([UndoMenuButton, RedoMenuButton, HeadingMenuButton, IndentMenuButton, QuoteMenuButton, SeparatorMenuButton, AlignMenuButton, OrderListMenuButton, UnorderListMenuButton, TaskMenuButton, BoldMenuButton, UnderlineMenuButton, ItalicMenuButton, StrikethroughMenuButton, CodeMenuButton, SuperMenuButton, SubMenuButton, FormatClearMenuButton, FontSizeMenuButton, FontFamilyMenuButton, LineHeightMenuButton, ForeColorMenuButton, BackColorMenuButton, LinkMenuButton, ImageMenuButton, VideoMenuButton, TableMenuButton, CodeBlockMenuButton, SourceViewMenuButton, FullScreenMenuButton, AttachmentMenuButton, MathformulaMenuButton, PanelMenuButton, InfoBlockMenuButton])
+const defaultMenus = shallowRef([UndoMenuButton, RedoMenuButton, HeadingMenuButton, IndentMenuButton, QuoteMenuButton, SeparatorMenuButton, AlignMenuButton, OrderListMenuButton, UnorderListMenuButton, TaskMenuButton, BoldMenuButton, UnderlineMenuButton, ItalicMenuButton, StrikethroughMenuButton, CodeMenuButton, SuperMenuButton, SubMenuButton, FormatClearMenuButton, FontSizeMenuButton, FontFamilyMenuButton, LineHeightMenuButton, ForeColorMenuButton, BackColorMenuButton, LinkMenuButton, ImageMenuButton, VideoMenuButton, TableMenuButton, CodeBlockMenuButton, SourceViewMenuButton, FullScreenMenuButton, AttachmentMenuButton, MathformulaMenuButton, InfoBlockMenuButton])
 //根据菜单名称获取对应的内置菜单组件
 const currentDefaultMenu = computed(() => {
 	return (name: string) => defaultMenus.value.find(item => item.name == `_${name}`)
@@ -128,7 +127,7 @@ const ExtendMenuButton = defineComponent(
 							zIndex: props.zIndex + 1,
 							ref: btnRef,
 							type: configuration.type || 'default',
-							title: configuration.title || '',
+							title: `${configuration.title || ''}${configuration.shortcut?.title ? `【${configuration.shortcut?.title}】` : ''}`,
 							leftBorder: configuration.leftBorder || false,
 							rightBorder: configuration.rightBorder || false,
 							hideScroll: configuration.hideScroll || false,

package/src/editify/props.ts

@@ -156,11 +156,6 @@ export const EditifyProps = {
 		type: Boolean,
 		default: false
 	},
-	//是否使用tab快捷键
-	tab: {
-		type: Boolean,
-		default: true
-	},
 	//是否使用深色模式
 	dark: {
 		type: Boolean,

package/src/feature/align.ts

@@ -30,7 +30,7 @@ export const AlignMenuButton = defineComponent(
 							color: props.color,
 							zIndex: props.zIndex,
 							type: 'select',
-							title: $editTrans('align'),
+							title: `${$editTrans('align')}${props.config.shortcut?.title ? `【${props.config.shortcut?.title}】` : ''}`,
 							selectConfig: {
 								options: props.config.options,
 								width: props.config.width,

package/src/feature/attachment.ts

@@ -35,7 +35,7 @@ export const AttachmentMenuButton = defineComponent(
 							zIndex: props.zIndex,
 							type: 'select',
 							hideScroll: true,
-							title: $editTrans('insertAttachment'),
+							title: `${$editTrans('insertAttachment')}${props.config.shortcut?.title ? `【${props.config.shortcut?.title}】` : ''}`,
 							leftBorder: props.config.leftBorder,
 							rightBorder: props.config.rightBorder,
 							active: false,