vue-editify 0.0.44 → 0.0.45

package/examples/App.vue

@@ -11,7 +11,7 @@ export default {
 	name: 'App',
 	data() {
 		return {
-			value: '<p><span>这是一个基于<img src="https://www.ling0523.cn/images/image_0_1701164609409.jpg"/> </span><code>Vue3 + alex-editor</code><span> 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: #ec1a0a;">富文本编辑器</span></p>',
+			value: '<p><span><span>这是一个基于</span><img src="https://www.ling0523.cn/images/image_0_1702452766522.png" data-editify-element="5" style="width: auto;"><span> </span></span><span data-editify-code="true">Vue3 + alex-editor</span><span> 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><pre data-editify-element="61"><span class="editify-hljs-type">Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文3333333本编辑器Vue3</span><span> </span><span class="editify-hljs-operator">+</span><span> alex</span><span class="editify-hljs-operator">-</span><span>editor 构建的一套精美</span><span class="editify-hljs-type">UI样式的开箱即用的富文本编辑器箱即用的富文本编辑器</span></pre><p><br></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>Vue3 + alex-editor 构建的一套</span><span style="font-weight: bold;">精美UI样式</span><span>的</span><span style="font-weight: bold;">开箱即用</span><span>的</span><span style="color: rgb(236, 26, 10);">富文本编辑器</span></p><p><span>v</span></p><p><br></p>',
 			menuConfig: {
 				mode: 'inner',
 				sequence: {
@@ -100,10 +100,10 @@ export default {
 		// 	this.value = '<p><br></p>'
 		// }, 3000)
 		setTimeout(() => {
-			const el = this.$refs.editify.editor.getElementByKey(4)
-			this.$refs.editify.editor.range.anchor.moveToStart(el)
-			this.$refs.editify.editor.range.focus.moveToStart(el)
-			this.$refs.editify.editor.rangeRender()
+			// const el = this.$refs.editify.editor.getElementByKey(4)
+			// this.$refs.editify.editor.range.anchor.moveToStart(el)
+			// this.$refs.editify.editor.range.focus.moveToStart(el)
+			// this.$refs.editify.editor.rangeRender()
 		}, 100)
 	},
 	methods: {

package/lib/editify.es.js

@@ -2994,7 +2994,7 @@ const setRangeInVisible = function() {
       const childRect = target.getBoundingClientRect();
       const parentRect = root.getBoundingClientRect();
       if (root.clientHeight < scrollHeight) {
-        if (childRect.top < parentRect.top) {
+        if (childRect.bottom < parentRect.top) {
           await obj$1.element.setScrollTop({
             el: root,
             number: 0
@@ -3003,9 +3003,9 @@ const setRangeInVisible = function() {
           const tempParentRect = root.getBoundingClientRect();
           obj$1.element.setScrollTop({
             el: root,
-            number: tempChildRect.top - tempParentRect.top - tempChildRect.height * 2
+            number: tempChildRect.top - tempParentRect.top
           });
-        } else if (childRect.bottom > parentRect.bottom) {
+        } else if (childRect.top > parentRect.bottom) {
           await obj$1.element.setScrollTop({
             el: root,
             number: 0
@@ -3014,12 +3014,12 @@ const setRangeInVisible = function() {
           const tempParentRect = root.getBoundingClientRect();
           obj$1.element.setScrollTop({
             el: root,
-            number: tempChildRect.bottom - tempParentRect.bottom + tempChildRect.height * 2
+            number: tempChildRect.bottom - tempParentRect.bottom
           });
         }
       }
       if (root.clientWidth < scrollWidth) {
-        if (childRect.left < parentRect.left) {
+        if (childRect.right < parentRect.left) {
           await obj$1.element.setScrollLeft({
             el: root,
             number: 0
@@ -3028,9 +3028,9 @@ const setRangeInVisible = function() {
           const tempParentRect = root.getBoundingClientRect();
           obj$1.element.setScrollLeft({
             el: root,
-            number: tempChildRect.left - tempParentRect.left - tempChildRect.width * 2 - (tempChildRect.width * 2 > 20 ? 0 : 20)
+            number: tempChildRect.left - tempParentRect.left + 20
           });
-        } else if (childRect.right > parentRect.right) {
+        } else if (childRect.left > parentRect.right) {
           await obj$1.element.setScrollLeft({
             el: root,
             number: 0
@@ -3039,7 +3039,7 @@ const setRangeInVisible = function() {
           const tempParentRect = root.getBoundingClientRect();
           obj$1.element.setScrollLeft({
             el: root,
-            number: tempChildRect.right - tempParentRect.right + tempChildRect.width * 2 + (tempChildRect.width * 2 > 20 ? 0 : 20)
+            number: tempChildRect.right - tempParentRect.right + 20
           });
         }
       }
@@ -23064,7 +23064,7 @@ const i18n = (locale) => {
     return translations[locale][key];
   };
 };
-const version = "0.0.44";
+const version = "0.0.45";
 const install = (app, props) => {
   const locale = (props ? props.locale : "zh_CN") || "zh_CN";
   app.provide("$editTrans", i18n(locale));