vue-editify 0.2.9 → 0.2.11

package/lib/hljs/index.d.ts

@@ -1,8 +1,15 @@
 
+/**
+ * 语言选项类型
+ */
 export type LanguagesItemType = {
     label?: string;
     value?: string;
 };
+/**
+ * 可选择语言列表
+ */
+export declare const languages: LanguagesItemType[];
 /**
  * 获取经过hljs处理的html元素
  * @param code
@@ -10,7 +17,3 @@ export type LanguagesItemType = {
  * @returns
  */
 export declare const getHljsHtml: (code: string, language: string) => string;
-/**
- * 可选择语言列表
- */
-export declare const languages: LanguagesItemType[];

package/lib/index.d.ts

@@ -118,6 +118,14 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
         type: BooleanConstructor;
         default: boolean;
     };
+    zIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+    offset: {
+        type: NumberConstructor;
+        default: number;
+    };
 }, {
     editor: import('vue').Ref<{
         $el: HTMLElement;
@@ -142,8 +150,8 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                     key: number;
                     type: import('alex-editor').AlexElementType;
                     parsedom: string | null;
-                    marks: import('alex-editor/lib/core/tool').ObjectType | null;
-                    styles: import('alex-editor/lib/core/tool').ObjectType | null;
+                    marks: import('alex-editor').ObjectType | null;
+                    styles: import('alex-editor').ObjectType | null;
                     textContent: string | null;
                     children: any[] | null;
                     parent: any | null;
@@ -162,7 +170,7 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                     getUneditableElement: () => import('alex-editor').AlexElement | null;
                     isEqual: (element: import('alex-editor').AlexElement) => boolean;
                     isContains: (element: import('alex-editor').AlexElement) => boolean;
-                    isOnlyHasBreak: () => boolean;
+                    isOnlyHasBreak: () => boolean | 0;
                     isPreStyle: () => boolean;
                     hasMarks: () => boolean;
                     hasStyles: () => boolean;
@@ -187,8 +195,8 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                             key: number;
                             type: import('alex-editor').AlexElementType;
                             parsedom: string | null;
-                            marks: import('alex-editor/lib/core/tool').ObjectType | null;
-                            styles: import('alex-editor/lib/core/tool').ObjectType | null;
+                            marks: import('alex-editor').ObjectType | null;
+                            styles: import('alex-editor').ObjectType | null;
                             textContent: string | null;
                             children: any[] | null;
                             parent: any | null;
@@ -207,7 +215,7 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                             getUneditableElement: () => import('alex-editor').AlexElement | null;
                             isEqual: (element: import('alex-editor').AlexElement) => boolean;
                             isContains: (element: import('alex-editor').AlexElement) => boolean;
-                            isOnlyHasBreak: () => boolean;
+                            isOnlyHasBreak: () => boolean | 0;
                             isPreStyle: () => boolean;
                             hasMarks: () => boolean;
                             hasStyles: () => boolean;
@@ -236,8 +244,8 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                             key: number;
                             type: import('alex-editor').AlexElementType;
                             parsedom: string | null;
-                            marks: import('alex-editor/lib/core/tool').ObjectType | null;
-                            styles: import('alex-editor/lib/core/tool').ObjectType | null;
+                            marks: import('alex-editor').ObjectType | null;
+                            styles: import('alex-editor').ObjectType | null;
                             textContent: string | null;
                             children: any[] | null;
                             parent: any | null;
@@ -256,7 +264,7 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                             getUneditableElement: () => import('alex-editor').AlexElement | null;
                             isEqual: (element: import('alex-editor').AlexElement) => boolean;
                             isContains: (element: import('alex-editor').AlexElement) => boolean;
-                            isOnlyHasBreak: () => boolean;
+                            isOnlyHasBreak: () => boolean | 0;
                             isPreStyle: () => boolean;
                             hasMarks: () => boolean;
                             hasStyles: () => boolean;
@@ -292,8 +300,8 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
             key: number;
             type: import('alex-editor').AlexElementType;
             parsedom: string | null;
-            marks: import('alex-editor/lib/core/tool').ObjectType | null;
-            styles: import('alex-editor/lib/core/tool').ObjectType | null;
+            marks: import('alex-editor').ObjectType | null;
+            styles: import('alex-editor').ObjectType | null;
             textContent: string | null;
             children: any[] | null;
             parent: any | null;
@@ -312,7 +320,7 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
             getUneditableElement: () => import('alex-editor').AlexElement | null;
             isEqual: (element: import('alex-editor').AlexElement) => boolean;
             isContains: (element: import('alex-editor').AlexElement) => boolean;
-            isOnlyHasBreak: () => boolean;
+            isOnlyHasBreak: () => boolean | 0;
             isPreStyle: () => boolean;
             hasMarks: () => boolean;
             hasStyles: () => boolean;
@@ -337,8 +345,8 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                     key: number;
                     type: import('alex-editor').AlexElementType;
                     parsedom: string | null;
-                    marks: import('alex-editor/lib/core/tool').ObjectType | null;
-                    styles: import('alex-editor/lib/core/tool').ObjectType | null;
+                    marks: import('alex-editor').ObjectType | null;
+                    styles: import('alex-editor').ObjectType | null;
                     textContent: string | null;
                     children: any[] | null;
                     parent: any | null;
@@ -357,7 +365,7 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                     getUneditableElement: () => import('alex-editor').AlexElement | null;
                     isEqual: (element: import('alex-editor').AlexElement) => boolean;
                     isContains: (element: import('alex-editor').AlexElement) => boolean;
-                    isOnlyHasBreak: () => boolean;
+                    isOnlyHasBreak: () => boolean | 0;
                     isPreStyle: () => boolean;
                     hasMarks: () => boolean;
                     hasStyles: () => boolean;
@@ -386,8 +394,8 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                     key: number;
                     type: import('alex-editor').AlexElementType;
                     parsedom: string | null;
-                    marks: import('alex-editor/lib/core/tool').ObjectType | null;
-                    styles: import('alex-editor/lib/core/tool').ObjectType | null;
+                    marks: import('alex-editor').ObjectType | null;
+                    styles: import('alex-editor').ObjectType | null;
                     textContent: string | null;
                     children: any[] | null;
                     parent: any | null;
@@ -406,7 +414,7 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                     getUneditableElement: () => import('alex-editor').AlexElement | null;
                     isEqual: (element: import('alex-editor').AlexElement) => boolean;
                     isContains: (element: import('alex-editor').AlexElement) => boolean;
-                    isOnlyHasBreak: () => boolean;
+                    isOnlyHasBreak: () => boolean | 0;
                     isPreStyle: () => boolean;
                     hasMarks: () => boolean;
                     hasStyles: () => boolean;
@@ -432,8 +440,50 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
             };
         } | null;
         __guid: number;
-        __events: import('alex-editor/lib/core/tool').ObjectType;
-        __firstRender: boolean;
+        __events: import('alex-editor').ObjectType;
+        __oldStack: {
+            key: number;
+            type: import('alex-editor').AlexElementType;
+            parsedom: string | null;
+            marks: import('alex-editor').ObjectType | null;
+            styles: import('alex-editor').ObjectType | null;
+            textContent: string | null;
+            children: any[] | null;
+            parent: any | null;
+            behavior: "default" | "block";
+            namespace: string | null;
+            locked: boolean;
+            elm: HTMLElement | null;
+            isBlock: () => boolean;
+            isInblock: () => boolean;
+            isInline: () => boolean;
+            isClosed: () => boolean;
+            isText: () => boolean;
+            isBreak: () => boolean;
+            isEmpty: () => boolean;
+            isSpaceText: () => boolean;
+            getUneditableElement: () => import('alex-editor').AlexElement | null;
+            isEqual: (element: import('alex-editor').AlexElement) => boolean;
+            isContains: (element: import('alex-editor').AlexElement) => boolean;
+            isOnlyHasBreak: () => boolean | 0;
+            isPreStyle: () => boolean;
+            hasMarks: () => boolean;
+            hasStyles: () => boolean;
+            hasChildren: () => boolean;
+            hasContains: (element: import('alex-editor').AlexElement) => boolean;
+            clone: (deep?: boolean | undefined) => import('alex-editor').AlexElement;
+            convertToBlock: () => void;
+            toEmpty: () => void;
+            getBlock: () => import('alex-editor').AlexElement;
+            getInblock: () => import('alex-editor').AlexElement | null;
+            getInline: () => import('alex-editor').AlexElement | null;
+            isEqualStyles: (element: import('alex-editor').AlexElement) => boolean;
+            isEqualMarks: (element: import('alex-editor').AlexElement) => boolean;
+            isFirst: (element: import('alex-editor').AlexElement) => boolean;
+            isLast: (element: import('alex-editor').AlexElement) => boolean;
+            __render: () => void;
+            __fullClone: () => import('alex-editor').AlexElement;
+        }[];
         __isInputChinese: boolean;
         __innerSelectionChange: boolean;
         __chineseInputTimer: any;
@@ -474,8 +524,8 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                 key: number;
                 type: import('alex-editor').AlexElementType;
                 parsedom: string | null;
-                marks: import('alex-editor/lib/core/tool').ObjectType | null;
-                styles: import('alex-editor/lib/core/tool').ObjectType | null;
+                marks: import('alex-editor').ObjectType | null;
+                styles: import('alex-editor').ObjectType | null;
                 textContent: string | null;
                 children: any[] | null;
                 parent: any | null;
@@ -494,7 +544,7 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                 getUneditableElement: () => import('alex-editor').AlexElement | null;
                 isEqual: (element: import('alex-editor').AlexElement) => boolean;
                 isContains: (element: import('alex-editor').AlexElement) => boolean;
-                isOnlyHasBreak: () => boolean;
+                isOnlyHasBreak: () => boolean | 0;
                 isPreStyle: () => boolean;
                 hasMarks: () => boolean;
                 hasStyles: () => boolean;
@@ -520,8 +570,8 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                 key: number;
                 type: import('alex-editor').AlexElementType;
                 parsedom: string | null;
-                marks: import('alex-editor/lib/core/tool').ObjectType | null;
-                styles: import('alex-editor/lib/core/tool').ObjectType | null;
+                marks: import('alex-editor').ObjectType | null;
+                styles: import('alex-editor').ObjectType | null;
                 textContent: string | null;
                 children: any[] | null;
                 parent: any | null;
@@ -540,7 +590,7 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
                 getUneditableElement: () => import('alex-editor').AlexElement | null;
                 isEqual: (element: import('alex-editor').AlexElement) => boolean;
                 isContains: (element: import('alex-editor').AlexElement) => boolean;
-                isOnlyHasBreak: () => boolean;
+                isOnlyHasBreak: () => boolean | 0;
                 isPreStyle: () => boolean;
                 hasMarks: () => boolean;
                 hasStyles: () => boolean;
@@ -563,6 +613,7 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
         }[];
     }>;
     textValue: import('vue').ComputedRef<string>;
+    menuHeight: import('vue').ComputedRef<number | null>;
     collapseToEnd: () => void;
     collapseToStart: () => void;
     undo: () => void;
@@ -695,22 +746,31 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
         type: BooleanConstructor;
         default: boolean;
     };
+    zIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+    offset: {
+        type: NumberConstructor;
+        default: number;
+    };
 }>> & {
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
     onFocus?: ((...args: any[]) => any) | undefined;
     onBlur?: ((...args: any[]) => any) | undefined;
     onChange?: ((...args: any[]) => any) | undefined;
     onKeydown?: ((...args: any[]) => any) | undefined;
     onKeyup?: ((...args: any[]) => any) | undefined;
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
     onInsertparagraph?: ((...args: any[]) => any) | undefined;
     onRangeupdate?: ((...args: any[]) => any) | undefined;
     onUpdateview?: ((...args: any[]) => any) | undefined;
 }, {
     color: string | null;
     disabled: boolean;
-    menu: import('./core/tool').MenuConfigType;
+    zIndex: number;
     modelValue: string;
     border: boolean;
+    menu: import('./core/tool').MenuConfigType;
     placeholder: string;
     autoheight: boolean;
     toolbar: import('./core/tool').ToolbarConfigType;
@@ -735,6 +795,7 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
     tab: boolean;
     plugins: import('./core/tool').PluginType[];
     dark: boolean;
+    offset: number;
 }, {}>>;
 export type { ButtonTypeType, ButtonOptionsItemType, ButtonSelectConfigType, ButtonDisplayConfigType } from './components/button/props';
 export type { InsertImageUploadErrorType } from './components/insertImage/props';
@@ -743,7 +804,7 @@ export type { MenuButtonType, MenuSelectButtonType, MenuDisplayButtonType, MenuI
 export type { ElementMatchConfigType } from './core/function';
 export { elementIsMatch, getMatchElementByElement, getMatchElementByRange, isList, isTask, elementIsInList, elementIsInTask, hasPreInRange, hasQuoteInRange, hasListInRange, hasTaskInRange, hasLinkInRange, hasTableInRange, hasImageInRange, hasVideoInRange, isRangeInQuote, isRangeInList, isRangeInTask, queryTextStyle, queryTextMark, getRangeText, setIndentIncrease, setIndentDecrease, setQuote, setAlign, setList, setTask, setTextStyle, setTextMark, removeTextStyle, removeTextMark, setLineHeight, insertLink, insertImage, insertVideo, insertTable, insertCodeBlock, insertSeparator } from './core/function';
 declare const install: (app: App) => void;
-declare const version = "0.2.9";
+declare const version = "0.2.11";
 export { AlexElement } from 'alex-editor';
 export type { AttachmentOptionsType } from './plugins/attachment';
 export type { InsertAttachmentUploadErrorType } from './plugins/attachment/insertAttachment/props';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "vue-editify",
-	"version": "0.2.9",
+	"version": "0.2.11",
 	"private": false,
 	"sideEffects": [
 		"*.css"
@@ -17,11 +17,11 @@
 		"lib": "vue-tsc && vite build"
 	},
 	"dependencies": {
-		"alex-editor": "^1.4.18",
-		"dap-util": "^1.5.7",
+		"alex-editor": "^1.4.20",
+		"dap-util": "^1.5.8",
 		"highlight.js": "^11.8.0",
 		"katex": "^0.16.10",
-		"vue": "^3.4.19"
+		"vue": "^3.4.31"
 	},
 	"devDependencies": {
 		"@types/katex": "^0.16.7",

package/src/components/button/button.less

@@ -78,66 +78,66 @@
 			}
 		}
 	}
+}
 
-	.editify-button-layer {
-		display: block;
-		position: relative;
-		overflow-x: hidden;
-		overflow-y: auto;
+.editify-button-layer {
+	display: block;
+	position: relative;
+	overflow-x: hidden;
+	overflow-y: auto;
 
-		&:not(:hover)::-webkit-scrollbar {
-			display: none;
-		}
+	&:not(:hover)::-webkit-scrollbar {
+		display: none;
+	}
+
+	.editify-button-options {
+		display: block;
+		width: 100%;
+		padding: 4px 0;
 
-		.editify-button-options {
-			display: block;
+		.editify-button-option {
+			display: flex;
+			justify-content: flex-start;
+			align-items: center;
 			width: 100%;
-			padding: 4px 0;
+			padding: 6px 12px;
+			transition: all 300ms;
+			opacity: 0.8;
+			white-space: nowrap;
+			text-overflow: ellipsis;
+			overflow: hidden;
+			box-sizing: border-box;
 
-			.editify-button-option {
+			&:hover {
+				opacity: 1;
+				cursor: pointer;
+				background-color: var(--editify-background-dark);
+			}
+
+			&:active {
+				opacity: 1;
+				background-color: var(--editify-background-darker);
+			}
+
+			&.editify-active {
+				opacity: 1;
+				background-color: var(--editify-background-darker);
+			}
+
+			.editify-button-option-flex {
 				display: flex;
 				justify-content: flex-start;
 				align-items: center;
 				width: 100%;
-				padding: 6px 12px;
-				transition: all 300ms;
-				opacity: 0.8;
-				white-space: nowrap;
-				text-overflow: ellipsis;
-				overflow: hidden;
-				box-sizing: border-box;
-
-				&:hover {
-					opacity: 1;
-					cursor: pointer;
-					background-color: var(--editify-background-dark);
-				}
-
-				&:active {
-					opacity: 1;
-					background-color: var(--editify-background-darker);
-				}
 
-				&.editify-active {
-					opacity: 1;
-					background-color: var(--editify-background-darker);
+				:deep(.editify-icon) {
+					margin-right: 10px;
 				}
 
-				.editify-button-option-flex {
-					display: flex;
-					justify-content: flex-start;
-					align-items: center;
-					width: 100%;
-
-					:deep(.editify-icon) {
-						margin-right: 10px;
-					}
-
-					span {
-						overflow: hidden;
-						text-overflow: ellipsis;
-						white-space: nowrap;
-					}
+				span {
+					overflow: hidden;
+					text-overflow: ellipsis;
+					white-space: nowrap;
 				}
 			}
 		}

package/src/components/button/button.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="editify-button">
 		<div class="editify-button-wrap" :class="{ 'editify-right-border': rightBorder, 'editify-left-border': leftBorder }">
-			<Tooltip :content="title" :disabled="!tooltip">
+			<Tooltip :content="title" :disabled="!tooltip" :z-index="zIndex">
 				<div ref="btnRef" :style="btnStyle" class="editify-button-el" :class="{ 'editify-disabled': disabled, 'editify-active': active }" @mouseenter="status = 'hover'" @mouseleave="status = null" @mousedown="status = 'down'" @mouseup="status = 'hover'" @click="handleClick">
 					<div v-if="type == 'default' || type == 'select'" class="editify-button-slot">
 						<slot></slot>
@@ -10,7 +10,7 @@
 					<Icon v-if="type == 'select' || type == 'display'" value="caret-down" class="editify-button-caret" :class="{ 'editify-rotate': show }"></Icon>
 				</div>
 			</Tooltip>
-			<Layer ref="layerRef" v-model="show" :node="btnRef" border fade placement="bottom-start" :z-index="12" animation="translate" @show="emits('layerShow')" @shown="emits('layerShown')" @hidden="emits('layerHidden')">
+			<Layer ref="layerRef" v-model="show" :node="btnRef" border placement="bottom-start" :z-index="zIndex + 1" animation="translate" @show="emits('layerShow')" @shown="emits('layerShown')" @hidden="emits('layerHidden')">
 				<div class="editify-button-layer" :style="{ width: (type == 'select' ? parseSelectConfig.width : parseDisplayConfig.width) + 'px', maxHeight: (type == 'select' ? parseSelectConfig.maxHeight : parseDisplayConfig.maxHeight) + 'px', overflow: hideScroll ? 'visible' : '' }">
 					<slot v-if="$slots.layer" name="layer" :options="cmpOptions"></slot>
 					<div v-else class="editify-button-options">
@@ -194,7 +194,8 @@ const handleClick = () => {
 
 defineExpose({
 	show,
-	status
+	status,
+	layerRef
 })
 </script>
 <style scoped src="./button.less"></style>

package/src/components/button/props.ts

@@ -89,6 +89,11 @@ export const ButtonProps = {
 	hideScroll: {
 		type: Boolean,
 		default: false
+	},
+	//工具提示的层级，下拉选式的浮层层级在此基础上+1
+	zIndex: {
+		type: Number,
+		default: 1
 	}
 }
 

package/src/components/layer/layer.less

@@ -20,7 +20,7 @@
 
 .editify-layer {
 	display: block;
-	position: absolute;
+	position: fixed;
 	padding: 0 0 10px 0;
 	font-size: var(--editify-font-size);
 	color: var(--editify-font-color);