@aochuang/client-sdk 1.0.282 → 1.0.284

package/components/chat-editor/chat-editor.vue

@@ -20,8 +20,10 @@
                 @paste="handleInputPaste"
                 @keydown="handleInputKeydown"
                 @keyup="handleInputKeyup"
+                @mouseup="handleInputMouseup"
                 @input="handleInputValueChange"
                 @focus="handleInputFocus"
+                @blur="handleInputBlur"
             ></div>
         </div>
         <template v-if="$slots.addon">
@@ -147,7 +149,7 @@ export default {
             if (this.disabled) {
                 return
             }
-            this.cacheInputRange = this.getSelectionTextRange()
+            this.cacheCurrentInputRange()
         },
         handleBeforeInput (evt) {
             if (this.disabled) {
@@ -199,7 +201,19 @@ export default {
             if (this.disabled) {
                 return
             }
-            this.cacheInputRange = this.getSelectionTextRange()
+            this.cacheCurrentInputRange()
+        },
+        handleInputMouseup () {
+            if (this.disabled) {
+                return
+            }
+            this.cacheCurrentInputRange()
+        },
+        handleInputBlur () {
+            if (this.disabled) {
+                return
+            }
+            this.cacheCurrentInputRange()
         },
         handleInputPaste (evt) {
             if (this.disabled) {
@@ -268,7 +282,7 @@ export default {
             if (!this.hasMaxlength()) {
                 return Infinity
             }
-            const range = this.getSelectionTextRange()
+            const range = this.getSafeRange() ? this.getSelectionTextRange() : (this.cacheInputRange || this.getSelectionTextRange())
             const selectedLength = Math.max(0, range.end - range.start)
             return Math.max(0, this.maxlength - (this.getInputText().length - selectedLength))
         },
@@ -408,12 +422,23 @@ export default {
             }
             return range
         },
-        focus () {
+        cacheCurrentInputRange () {
+            const range = this.getSafeRange()
+            if (!range) {
+                return false
+            }
+            this.cacheInputRange = {
+                start: this.getTextOffsetByDomPoint(range.startContainer, range.startOffset),
+                end: this.getTextOffsetByDomPoint(range.endContainer, range.endOffset)
+            }
+            return true
+        },
+        focus (options = {}) {
             if (!this.$refs.input || this.disabled) {
                 return
             }
             this.$refs.input.focus()
-            if (!this.getSafeRange()) {
+            if (options.resetCursor || !this.getSafeRange()) {
                 this.setCursorByTextOffset(this.getInputText().length)
             }
         },
@@ -626,7 +651,12 @@ export default {
             return ['DIV', 'P', 'LI'].includes(node.tagName)
         },
         insertNodesAtSelection (nodes) {
+            const cachedRange = this.cacheInputRange ? Object.assign({}, this.cacheInputRange) : null
+            const shouldRestoreCachedRange = !this.getSafeRange() && cachedRange
             this.focus()
+            if (shouldRestoreCachedRange) {
+                this.setSelectionByTextRange(cachedRange.start, cachedRange.end)
+            }
             let range = this.getSafeRange()
             if (!range) {
                 this.setCursorByTextOffset(this.getInputText().length)
@@ -644,6 +674,7 @@ export default {
             })
             if (lastNode) {
                 this.setCursorAfterNode(lastNode)
+                this.cacheCurrentInputRange()
             }
         },
         insertFragmentAtSelection (fragment) {
@@ -787,7 +818,7 @@ export default {
                 this.setInputText(this.inputValue.slice(0, this.maxlength))
                 this.setCursorByTextOffset(this.inputValue.length)
             }
-            this.cacheInputRange = this.getSelectionTextRange()
+            this.cacheCurrentInputRange()
             if (this._skipNextSuggestionsLoad) {
                 this._skipNextSuggestionsLoad = false
             } else {

package/components/session-select/session-select.vue

@@ -104,7 +104,6 @@ export default {
 	data () {
 		return {
 			pageSize: 40,
-			tuckReady: false,
 			allowTuck: false,
 			loading: false
 		}
@@ -190,17 +189,24 @@ export default {
 	},
 	watch: {
 		lastStickyOnTopSession () {
-			this.delayCheckAllowTuck()
+			this.checkAllowTuckAfterRender()
+		},
+		tucked () {
+			this.checkAllowTuckAfterRender()
+		},
+		sessionListData () {
+			this.checkAllowTuckAfterRender()
 		}
 	},
 	mounted () {
-		this.resizeObserver = new ResizeObserver(entries => {
+		this.resizeObserver = new ResizeObserver(() => {
 			this.delayCheckAllowTuck()
 		})
-		this.resizeObserver.observe(this.$el)
+		this.observeTuckTarget()
 		if (this.autoLoad) {
 			this.$refs.loadMore.reload()
 		}
+		this.checkAllowTuckAfterRender()
 	},
 	methods: {
         reload () {
@@ -208,7 +214,6 @@ export default {
 				return
 			}
 			return this.$refs.loadMore.reload().then(() => {
-				this.tuckReady = true
 				this.delayCheckAllowTuck()
 			})
         },
@@ -221,13 +226,33 @@ export default {
 		scrollTop (top) {
 			this.$refs.loadMore.scrollTop(top)
 		},
-		delayCheckAllowTuck () {
-			if (!this.tuckReady) {
+		observeTuckTarget () {
+			if (!this.resizeObserver || !this.$el) {
 				return
 			}
+			this.resizeObserver.disconnect()
+			this.resizeObserver.observe(this.$el)
+			if (this.$refs.loadMore && this.$refs.loadMore.$el && this.$refs.loadMore.$el !== this.$el) {
+				this.resizeObserver.observe(this.$refs.loadMore.$el)
+			}
+			if (this.lastStickyOnTopSession) {
+				const $lastStickyOnTopEls = this.$refs['item-' + this.lastStickyOnTopSession[this.idField]]
+				if ($lastStickyOnTopEls && $lastStickyOnTopEls.length) {
+					this.resizeObserver.observe($lastStickyOnTopEls[0])
+				}
+			}
+		},
+		checkAllowTuckAfterRender () {
+			this.$nextTick(() => {
+				this.observeTuckTarget()
+				this.delayCheckAllowTuck()
+			})
+		},
+		delayCheckAllowTuck () {
 			clearTimeout(this._checkTimer)
 			this._checkTimer = setTimeout(() => {
-				if (!this.tuckable) {
+				if (!this.tuckable || !this.$el) {
+					this.allowTuck = false
 					return 
 				}
 				if (this.tucked) {
@@ -298,7 +323,9 @@ export default {
 		}
 	},
 	beforeDestroy () {
-		this.resizeObserver && this.resizeObserver.unobserve(this.$el)
+		clearTimeout(this._checkTimer)
+		this.resizeObserver && this.resizeObserver.disconnect()
+		this.resizeObserver = null
 	}
 }
 </script>
@@ -321,6 +348,7 @@ export default {
 	align-items: center;
 	transition: background-color .25s;
 	cursor: pointer;
+	z-index: 3;
 	&:hover {
 		&:not(.is-loading) {
 			background-color: #ddd;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aochuang/client-sdk",
-  "version": "1.0.282",
+  "version": "1.0.284",
   "description": "",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"