vue-editify 0.1.17 → 0.1.18

package/examples/App.vue

@@ -1,11 +1,11 @@
 <template>
 	<div style="padding: 80px 10px 10px 10px; height: 100%; box-sizing: border-box">
-		<Editify ref="editify" border v-model="val" :menu="menuConfig" style="height: 100%" placeholder="Please Enter Text..." locale="zh_CN" allowPasteHtml :custom-image-paste="customImagePaste"></Editify>
+		<Editify ref="editify" border v-model="val" :menu="menuConfig" style="height: 100%" placeholder="Please Enter Text..." locale="zh_CN" allowPasteHtml :customHtmlPaste="customHtmlPaste"></Editify>
 	</div>
 </template>
 <script setup lang="ts">
 import { ref } from 'vue'
-import { Editify, insertImage, insertVideo } from '../src/index'
+import { AlexElement, Editify, insertImage, insertVideo } from '../src/index'
 import { MenuConfigType } from '../src/index'
 const val = ref<string>('<p><br></p>')
 const editify = ref<InstanceType<typeof Editify> | null>(null)
@@ -22,9 +22,17 @@ const menuConfig = ref<MenuConfigType>({
 		show: true
 	}
 })
-const customImagePaste = url => {
-	console.log(url)
-	insertImage(editify.value!.editor!, url)
+const customHtmlPaste = function (elements) {
+	for (let i = 0; i < elements.length; i++) {
+		if (elements[i].hasMarks()) {
+			elements[i].marks['data-paste'] = 'true'
+		} else {
+			elements[i].marks = {
+				'data-paste': 'true'
+			}
+		}
+		editify.value!.editor!.insertElement(elements[i], false)
+	}
 }
 </script>
 <style lang="less">

package/lib/editify/editify.vue.d.ts

@@ -59,16 +59,24 @@ declare const _default: import('vue').DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    customTextPaste: {
+        type: import("vue").PropType<(data: string) => void | Promise<void>>;
+        default: null;
+    };
+    customHtmlPaste: {
+        type: import("vue").PropType<(elements: AlexElement[]) => void | Promise<void>>;
+        default: null;
+    };
     customImagePaste: {
-        type: import("vue").PropType<(url: string) => void | Promise<void>>;
+        type: import("vue").PropType<(file: File) => void | Promise<void>>;
         default: null;
     };
     customVideoPaste: {
-        type: import("vue").PropType<(url: string) => void | Promise<void>>;
+        type: import("vue").PropType<(file: File) => void | Promise<void>>;
         default: null;
     };
     customFilePaste: {
-        type: import("vue").PropType<(url: string) => void | Promise<void>>;
+        type: import("vue").PropType<(file: File) => void | Promise<void>>;
         default: null;
     };
     menu: {
@@ -111,9 +119,9 @@ declare const _default: import('vue').DefineComponent<{
         allowPasteHtml: boolean;
         customTextPaste: ((text: string) => void | Promise<void>) | null;
         customHtmlPaste: ((AlexElements: AlexElement[], html: string) => void | Promise<void>) | null;
-        customImagePaste: ((url: string) => void | Promise<void>) | null;
-        customVideoPaste: ((url: string) => void | Promise<void>) | null;
-        customFilePaste: ((url: string) => void | Promise<void>) | null;
+        customImagePaste: ((file: File) => void | Promise<void>) | null;
+        customVideoPaste: ((file: File) => void | Promise<void>) | null;
+        customFilePaste: ((file: File) => void | Promise<void>) | null;
         customMerge: ((mergeElement: AlexElement, targetElement: AlexElement) => void | Promise<void>) | null;
         customParseNode: ((el: AlexElement) => AlexElement) | null;
         useClipboard: boolean;
@@ -607,16 +615,24 @@ declare const _default: import('vue').DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    customTextPaste: {
+        type: import("vue").PropType<(data: string) => void | Promise<void>>;
+        default: null;
+    };
+    customHtmlPaste: {
+        type: import("vue").PropType<(elements: AlexElement[]) => void | Promise<void>>;
+        default: null;
+    };
     customImagePaste: {
-        type: import("vue").PropType<(url: string) => void | Promise<void>>;
+        type: import("vue").PropType<(file: File) => void | Promise<void>>;
         default: null;
     };
     customVideoPaste: {
-        type: import("vue").PropType<(url: string) => void | Promise<void>>;
+        type: import("vue").PropType<(file: File) => void | Promise<void>>;
         default: null;
     };
     customFilePaste: {
-        type: import("vue").PropType<(url: string) => void | Promise<void>>;
+        type: import("vue").PropType<(file: File) => void | Promise<void>>;
         default: null;
     };
     menu: {
@@ -673,9 +689,11 @@ declare const _default: import('vue').DefineComponent<{
     allowPasteHtml: boolean;
     videoRatio: number;
     showWordLength: boolean;
-    customImagePaste: (url: string) => void | Promise<void>;
-    customVideoPaste: (url: string) => void | Promise<void>;
-    customFilePaste: (url: string) => void | Promise<void>;
+    customTextPaste: (data: string) => void | Promise<void>;
+    customHtmlPaste: (elements: AlexElement[]) => void | Promise<void>;
+    customImagePaste: (file: File) => void | Promise<void>;
+    customVideoPaste: (file: File) => void | Promise<void>;
+    customFilePaste: (file: File) => void | Promise<void>;
     pasteKeepMarks: ObjectType;
     pasteKeepStyles: ObjectType;
     customParseNode: (el: AlexElement) => AlexElement;

package/lib/editify/props.d.ts

@@ -70,16 +70,24 @@ export declare const EditifyProps: {
         type: BooleanConstructor;
         default: boolean;
     };
+    customTextPaste: {
+        type: PropType<(data: string) => void | Promise<void>>;
+        default: null;
+    };
+    customHtmlPaste: {
+        type: PropType<(elements: AlexElement[]) => void | Promise<void>>;
+        default: null;
+    };
     customImagePaste: {
-        type: PropType<(url: string) => void | Promise<void>>;
+        type: PropType<(file: File) => void | Promise<void>>;
         default: null;
     };
     customVideoPaste: {
-        type: PropType<(url: string) => void | Promise<void>>;
+        type: PropType<(file: File) => void | Promise<void>>;
         default: null;
     };
     customFilePaste: {
-        type: PropType<(url: string) => void | Promise<void>>;
+        type: PropType<(file: File) => void | Promise<void>>;
         default: null;
     };
     menu: {

package/lib/editify.es.js

@@ -2978,11 +2978,11 @@ const doPaste = async function(html, text, files) {
     } else {
       let length = files.length;
       for (let i = 0; i < length; i++) {
-        const url = await file$1.dataFileToBase64(files[i]);
         if (files[i].type.startsWith("image/")) {
           if (typeof this.customImagePaste == "function") {
-            await this.customImagePaste.apply(this, [url]);
+            await this.customImagePaste.apply(this, [files[i]]);
           } else {
+            const url = await file$1.dataFileToBase64(files[i]);
             const image = new AlexElement(
               "closed",
               "img",
@@ -2997,8 +2997,9 @@ const doPaste = async function(html, text, files) {
           }
         } else if (files[i].type.startsWith("video/")) {
           if (typeof this.customVideoPaste == "function") {
-            await this.customVideoPaste.apply(this, [url]);
+            await this.customVideoPaste.apply(this, [files[i]]);
           } else {
+            const url = await file$1.dataFileToBase64(files[i]);
             const video = new AlexElement(
               "closed",
               "video",
@@ -3013,7 +3014,7 @@ const doPaste = async function(html, text, files) {
           }
         } else {
           if (typeof this.customFilePaste == "function") {
-            await this.customFilePaste.apply(this, [url]);
+            await this.customFilePaste.apply(this, [files[i]]);
           }
         }
       }
@@ -24789,6 +24790,16 @@ const EditifyProps = {
     type: Boolean,
     default: false
   },
+  //自定义粘贴纯文字
+  customTextPaste: {
+    type: Function,
+    default: null
+  },
+  //自定义粘贴html
+  customHtmlPaste: {
+    type: Function,
+    default: null
+  },
   //自定义粘贴图片
   customImagePaste: {
     type: Function,
@@ -25227,9 +25238,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         allowPaste: props.allowPaste,
         allowCut: props.allowCut,
         allowPasteHtml: props.allowPasteHtml,
+        customTextPaste: props.customTextPaste,
         customImagePaste: props.customImagePaste,
         customVideoPaste: props.customVideoPaste,
         customFilePaste: props.customFilePaste,
+        customHtmlPaste: handleCustomHtmlPaste,
         customMerge: handleCustomMerge,
         customParseNode: handleCustomParseNode
       });
@@ -25239,7 +25252,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       editor.value.on("blur", handleEditorBlur);
       editor.value.on("insertParagraph", handleInsertParagraph);
       editor.value.on("rangeUpdate", handleRangeUpdate);
-      editor.value.on("pasteHtml", handlePasteHtml);
       editor.value.on("deleteInStart", handleDeleteInStart);
       editor.value.on("deleteComplete", handleDeleteComplete);
       editor.value.on("afterRender", handleAfterRender);
@@ -25359,6 +25371,37 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         }
       }
     };
+    const handleCustomHtmlPaste = async (elements) => {
+      const keepStyles = Object.assign(pasteKeepData.styles, props.pasteKeepStyles || {});
+      const keepMarks = Object.assign(pasteKeepData.marks, props.pasteKeepMarks || {});
+      AlexElement.flatElements(elements).forEach((el) => {
+        let marks = {};
+        let styles = {};
+        if (el.hasMarks()) {
+          for (let key in keepMarks) {
+            if (el.marks.hasOwnProperty(key) && (Array.isArray(keepMarks[key]) && keepMarks[key].includes(el.parsedom) || keepMarks[key] == "*")) {
+              marks[key] = el.marks[key];
+            }
+          }
+          el.marks = marks;
+        }
+        if (el.hasStyles() && !el.isText()) {
+          for (let key in keepStyles) {
+            if (el.styles.hasOwnProperty(key) && (Array.isArray(keepStyles[key]) && keepStyles[key].includes(el.parsedom) || keepStyles[key] == "*")) {
+              styles[key] = el.styles[key];
+            }
+          }
+          el.styles = styles;
+        }
+      });
+      if (typeof props.customHtmlPaste == "function") {
+        await props.customHtmlPaste.apply(this, [elements]);
+      } else {
+        for (let i = 0; i < elements.length; i++) {
+          editor.value.insertElement(elements[i], false);
+        }
+      }
+    };
     const handleCustomMerge = (ele, preEle) => {
       const uneditable = preEle.getUneditableElement();
       if (uneditable) {
@@ -25498,30 +25541,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }, 200);
       emits("rangeupdate");
     };
-    const handlePasteHtml = (elements) => {
-      const keepStyles = Object.assign(pasteKeepData.styles, props.pasteKeepStyles || {});
-      const keepMarks = Object.assign(pasteKeepData.marks, props.pasteKeepMarks || {});
-      AlexElement.flatElements(elements).forEach((el) => {
-        let marks = {};
-        let styles = {};
-        if (el.hasMarks()) {
-          for (let key in keepMarks) {
-            if (el.marks.hasOwnProperty(key) && (Array.isArray(keepMarks[key]) && keepMarks[key].includes(el.parsedom) || keepMarks[key] == "*")) {
-              marks[key] = el.marks[key];
-            }
-          }
-          el.marks = marks;
-        }
-        if (el.hasStyles() && !el.isText()) {
-          for (let key in keepStyles) {
-            if (el.styles.hasOwnProperty(key) && (Array.isArray(keepStyles[key]) && keepStyles[key].includes(el.parsedom) || keepStyles[key] == "*")) {
-              styles[key] = el.styles[key];
-            }
-          }
-          el.styles = styles;
-        }
-      });
-    };
     const handleDeleteInStart = (element2) => {
       if (element2.isBlock()) {
         elementToParagraph(element2);
@@ -25719,8 +25738,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Editify = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-fed58116"]]);
-const version = "0.1.17";
+const Editify = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c0db2307"]]);
+const version = "0.1.18";
 const install = (app) => {
   app.component(Editify.name, Editify);
 };