slate-angular 20.2.0-next.25 → 20.2.0-next.26

package/fesm2022/slate-angular.mjs

@@ -957,6 +957,30 @@ const fallbackCopyText = async (text) => {
 
 const ELEMENT_KEY_TO_HEIGHTS = new WeakMap();
 const EDITOR_TO_BUSINESS_TOP = new WeakMap();
+const measureHeightByElement = (editor, element) => {
+    const key = AngularEditor.findKey(editor, element);
+    const view = ELEMENT_TO_COMPONENT.get(element);
+    if (!view) {
+        return;
+    }
+    const ret = view.getRealHeight();
+    const heights = ELEMENT_KEY_TO_HEIGHTS.get(editor);
+    heights.set(key.id, ret);
+    return ret;
+};
+const measureHeightByIndics = (editor, indics, force = false) => {
+    let hasChanged = false;
+    indics.forEach((index, i) => {
+        const element = editor.children[index];
+        const preHeight = getRealHeightByElement(editor, element, 0);
+        if (preHeight && !force) {
+            return;
+        }
+        hasChanged = true;
+        measureHeightByElement(editor, element);
+    });
+    return hasChanged;
+};
 const getBusinessTop = (editor) => {
     return EDITOR_TO_BUSINESS_TOP.get(editor) ?? 0;
 };
@@ -965,9 +989,6 @@ const getRealHeightByElement = (editor, element, defaultHeight = VIRTUAL_SCROLL_
     if (!isVisible) {
         return 0;
     }
-    if (!element) {
-        return defaultHeight;
-    }
     const heights = ELEMENT_KEY_TO_HEIGHTS.get(editor);
     const key = AngularEditor.findKey(editor, element);
     const height = heights?.get(key.id);
@@ -3291,7 +3312,6 @@ class SlateEditable {
                     const { preRenderingCount, childrenWithPreRendering } = this.handlePreRendering();
                     this.listRender.update(childrenWithPreRendering, this.editor, this.context, preRenderingCount);
                 }
-                this.tryMeasureInViewportChildrenHeights();
             }
             else {
                 if (!this.listRender.initialized) {
@@ -3516,7 +3536,7 @@ class SlateEditable {
         if (isDebug && remeasureIndics.length > 0) {
             console.log('remeasure height by indics: ', remeasureIndics);
         }
-        this.remeasureHeightByIndics(remeasureIndics);
+        measureHeightByIndics(this.editor, remeasureIndics, true);
     }
     updateContext() {
         const decorations = this.generateDecorations();
@@ -3604,7 +3624,7 @@ class SlateEditable {
                     editorResizeObserverRectWidth = entries[0].contentRect.width;
                     this.keyHeightMap.clear();
                     const remeasureIndics = this.inViewportIndics;
-                    this.remeasureHeightByIndics(remeasureIndics);
+                    measureHeightByIndics(this.editor, remeasureIndics);
                 }
             });
             this.editorResizeObserver.observe(this.elementRef.nativeElement);
@@ -3659,37 +3679,46 @@ class SlateEditable {
             }
             let virtualView = this.calculateVirtualViewport();
             let diff = this.diffVirtualViewport(virtualView);
+            if (diff.isDifferent && diff.needRemoveOnTop) {
+                const remeasureIndics = diff.changedIndexesOfTop;
+                const changed = measureHeightByIndics(this.editor, remeasureIndics);
+                if (changed) {
+                    virtualView = this.calculateVirtualViewport();
+                    diff = this.diffVirtualViewport(virtualView, 'second');
+                }
+            }
             if (diff.isDifferent) {
                 this.applyVirtualView(virtualView);
                 if (this.listRender.initialized) {
                     const { preRenderingCount, childrenWithPreRendering } = this.handlePreRendering();
                     this.listRender.update(childrenWithPreRendering, this.editor, this.context, preRenderingCount);
+                    if (diff.needAddOnTop) {
+                        const remeasureAddedIndics = diff.changedIndexesOfTop;
+                        if (isDebug) {
+                            this.debugLog('log', 'needAddOnTop to remeasure heights: ', remeasureAddedIndics);
+                        }
+                        const startIndexBeforeAdd = diff.changedIndexesOfTop[diff.changedIndexesOfTop.length - 1] + 1;
+                        const topHeightBeforeAdd = virtualView.accumulatedHeights[startIndexBeforeAdd];
+                        const result = measureHeightByIndics(this.editor, remeasureAddedIndics);
+                        if (result) {
+                            const newHeights = buildHeightsAndAccumulatedHeights(this.editor);
+                            const actualTopHeightAfterAdd = newHeights.accumulatedHeights[startIndexBeforeAdd];
+                            const newTopHeight = virtualView.top - (actualTopHeightAfterAdd - topHeightBeforeAdd);
+                            this.setVirtualSpaceHeight(newTopHeight);
+                            if (isDebug) {
+                                this.debugLog('log', `update top height since will add element in top（正数减去高度，负数代表增加高度）: ${actualTopHeightAfterAdd - topHeightBeforeAdd}`);
+                            }
+                        }
+                    }
                     if (!AngularEditor.isReadOnly(this.editor) && this.editor.selection) {
                         this.toNativeSelection();
                     }
                 }
-                if (diff.needAddOnTop) {
-                    const remeasureAddedIndics = diff.changedIndexesOfTop;
-                    if (isDebug) {
-                        this.debugLog('log', 'needAddOnTop to remeasure heights: ', remeasureAddedIndics);
-                    }
-                    const startIndexBeforeAdd = diff.changedIndexesOfTop[diff.changedIndexesOfTop.length - 1] + 1;
-                    const topHeightBeforeAdd = virtualView.accumulatedHeights[startIndexBeforeAdd];
-                    const result = this.remeasureHeightByIndics(remeasureAddedIndics);
-                    if (result) {
-                        const newHeights = buildHeightsAndAccumulatedHeights(this.editor);
-                        const actualTopHeightAfterAdd = newHeights.accumulatedHeights[startIndexBeforeAdd];
-                        const newTopHeight = virtualView.top - (actualTopHeightAfterAdd - topHeightBeforeAdd);
-                        this.setVirtualSpaceHeight(newTopHeight);
-                        this.debugLog('log', `update top height cause added element in top, 减去: ${actualTopHeightAfterAdd - topHeightBeforeAdd}`);
-                    }
-                }
-                this.tryMeasureInViewportChildrenHeights();
             }
             else {
                 const topHeight = this.getVirtualTopHeight();
                 if (virtualView.top !== topHeight) {
-                    this.debugLog('log', 'update top height: ', virtualView.top - topHeight, 'start index', this.inViewportIndics[0]);
+                    this.debugLog('log', 'update top height since invalid status（正数减去高度，负数代表增加高度）: ', topHeight - virtualView.top);
                     this.setVirtualSpaceHeight(virtualView.top);
                 }
             }
@@ -3875,81 +3904,6 @@ class SlateEditable {
             changedIndexesOfBottom: []
         };
     }
-    tryMeasureInViewportChildrenHeights() {
-        if (!this.isEnabledVirtualScroll()) {
-            return;
-        }
-        this.tryMeasureInViewportChildrenHeightsAnimId && cancelAnimationFrame(this.tryMeasureInViewportChildrenHeightsAnimId);
-        this.tryMeasureInViewportChildrenHeightsAnimId = requestAnimationFrame(() => {
-            this.measureVisibleHeights();
-        });
-    }
-    measureVisibleHeights() {
-        const children = (this.editor.children || []);
-        const inViewportIndics = [...this.inViewportIndics];
-        inViewportIndics.forEach(index => {
-            const node = children[index];
-            if (!node) {
-                return;
-            }
-            const key = AngularEditor.findKey(this.editor, node);
-            // 跳过已测过的块，除非强制测量
-            if (this.keyHeightMap.has(key.id)) {
-                return;
-            }
-            const view = ELEMENT_TO_COMPONENT.get(node);
-            if (!view) {
-                return;
-            }
-            const ret = view.getRealHeight();
-            if (ret instanceof Promise) {
-                ret.then(height => {
-                    this.keyHeightMap.set(key.id, height);
-                });
-            }
-            else {
-                this.keyHeightMap.set(key.id, ret);
-            }
-        });
-    }
-    remeasureHeightByIndics(indics) {
-        const children = (this.editor.children || []);
-        let isHeightChanged = false;
-        indics.forEach((index, i) => {
-            const node = children[index];
-            if (!node) {
-                return;
-            }
-            const key = AngularEditor.findKey(this.editor, node);
-            const view = ELEMENT_TO_COMPONENT.get(node);
-            if (!view) {
-                return;
-            }
-            const prevHeight = this.keyHeightMap.get(key.id);
-            const ret = view.getRealHeight();
-            if (ret instanceof Promise) {
-                ret.then(height => {
-                    this.keyHeightMap.set(key.id, height);
-                    if (height !== prevHeight) {
-                        isHeightChanged = true;
-                        if (isDebug) {
-                            this.debugLog('log', `remeasure element height, index: ${index} prevHeight: ${prevHeight} newHeight: ${height}`);
-                        }
-                    }
-                });
-            }
-            else {
-                this.keyHeightMap.set(key.id, ret);
-                if (ret !== prevHeight) {
-                    isHeightChanged = true;
-                    if (isDebug) {
-                        this.debugLog('log', `remeasure element height, index: ${index} prevHeight: ${prevHeight} newHeight: ${ret}`);
-                    }
-                }
-            }
-        });
-        return isHeightChanged;
-    }
     //#region event proxy
     addEventListener(eventName, listener, target = this.elementRef.nativeElement) {
         this.manualListeners.push(this.renderer2.listen(target, eventName, (event) => {
@@ -5182,5 +5136,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AngularEditor, BaseComponent, BaseElementComponent, BaseElementFlavour, BaseFlavour, BaseLeafComponent, BaseLeafFlavour, BaseTextComponent, BaseTextFlavour, BlockCardRef, DEFAULT_ELEMENT_HEIGHT, DefaultTextFlavour, EDITOR_TO_AFTER_VIEW_INIT_QUEUE, EDITOR_TO_BUSINESS_TOP, EDITOR_TO_VIRTUAL_SCROLL_SELECTION, ELEMENT_KEY_TO_HEIGHTS, ELEMENT_TO_COMPONENT, FAKE_LEFT_BLOCK_CARD_OFFSET, FAKE_RIGHT_BLOCK_CARD_OFFSET, FlavourRef, HAS_BEFORE_INPUT_SUPPORT, IS_ANDROID, IS_APPLE, IS_CHROME, IS_CHROME_LEGACY, IS_EDGE_LEGACY, IS_ENABLED_VIRTUAL_SCROLL, IS_FIREFOX, IS_FIREFOX_LEGACY, IS_IOS, IS_QQBROWSER, IS_SAFARI, IS_UC_MOBILE, IS_WECHATBROWSER, PLACEHOLDER_SYMBOL, SLATE_BLOCK_CARD_CLASS_NAME, SLATE_DEBUG_KEY, SLATE_DEBUG_KEY_SCROLL_TOP, SlateBlockCard, SlateChildrenOutlet, SlateEditable, SlateErrorCode, SlateFragmentAttributeKey, SlateModule, SlateString, VIRTUAL_SCROLL_DEFAULT_BLOCK_HEIGHT, VoidTextFlavour, blobAsString, buildHTMLText, buildHeightsAndAccumulatedHeights, check, completeTable, createClipboardData, createText, createThrottleRAF, defaultScrollSelectionIntoView, fallbackCopyText, getBlockCardByNativeElement, getBusinessTop, getCardTargetAttribute, getClipboardData, getClipboardFromHTMLText, getContentHeight, getDataTransferClipboard, getDataTransferClipboardText, getNavigatorClipboard, getPlainText, getRealHeightByElement, getSelection, getSlateFragmentAttribute, getZeroTextNode, hasAfterContextChange, hasBeforeContextChange, hasBlockCard, hasBlockCardWithNode, hotkeys, isCardCenterByTargetAttr, isCardLeft, isCardLeftByTargetAttr, isCardRightByTargetAttr, isClipboardFile, isClipboardReadSupported, isClipboardWriteSupported, isClipboardWriteTextSupported, isComponentType, isDOMText, isDecoratorRangeListEqual, isFlavourType, isInvalidTable, isTemplateRef, isValid, normalize, scrollToElement, setClipboardData, setDataTransferClipboard, setDataTransferClipboardText, setNavigatorClipboard, shallowCompare, stripHtml, withAngular };
+export { AngularEditor, BaseComponent, BaseElementComponent, BaseElementFlavour, BaseFlavour, BaseLeafComponent, BaseLeafFlavour, BaseTextComponent, BaseTextFlavour, BlockCardRef, DEFAULT_ELEMENT_HEIGHT, DefaultTextFlavour, EDITOR_TO_AFTER_VIEW_INIT_QUEUE, EDITOR_TO_BUSINESS_TOP, EDITOR_TO_VIRTUAL_SCROLL_SELECTION, ELEMENT_KEY_TO_HEIGHTS, ELEMENT_TO_COMPONENT, FAKE_LEFT_BLOCK_CARD_OFFSET, FAKE_RIGHT_BLOCK_CARD_OFFSET, FlavourRef, HAS_BEFORE_INPUT_SUPPORT, IS_ANDROID, IS_APPLE, IS_CHROME, IS_CHROME_LEGACY, IS_EDGE_LEGACY, IS_ENABLED_VIRTUAL_SCROLL, IS_FIREFOX, IS_FIREFOX_LEGACY, IS_IOS, IS_QQBROWSER, IS_SAFARI, IS_UC_MOBILE, IS_WECHATBROWSER, PLACEHOLDER_SYMBOL, SLATE_BLOCK_CARD_CLASS_NAME, SLATE_DEBUG_KEY, SLATE_DEBUG_KEY_SCROLL_TOP, SlateBlockCard, SlateChildrenOutlet, SlateEditable, SlateErrorCode, SlateFragmentAttributeKey, SlateModule, SlateString, VIRTUAL_SCROLL_DEFAULT_BLOCK_HEIGHT, VoidTextFlavour, blobAsString, buildHTMLText, buildHeightsAndAccumulatedHeights, check, completeTable, createClipboardData, createText, createThrottleRAF, defaultScrollSelectionIntoView, fallbackCopyText, getBlockCardByNativeElement, getBusinessTop, getCardTargetAttribute, getClipboardData, getClipboardFromHTMLText, getContentHeight, getDataTransferClipboard, getDataTransferClipboardText, getNavigatorClipboard, getPlainText, getRealHeightByElement, getSelection, getSlateFragmentAttribute, getZeroTextNode, hasAfterContextChange, hasBeforeContextChange, hasBlockCard, hasBlockCardWithNode, hotkeys, isCardCenterByTargetAttr, isCardLeft, isCardLeftByTargetAttr, isCardRightByTargetAttr, isClipboardFile, isClipboardReadSupported, isClipboardWriteSupported, isClipboardWriteTextSupported, isComponentType, isDOMText, isDecoratorRangeListEqual, isFlavourType, isInvalidTable, isTemplateRef, isValid, measureHeightByElement, measureHeightByIndics, normalize, scrollToElement, setClipboardData, setDataTransferClipboard, setDataTransferClipboardText, setNavigatorClipboard, shallowCompare, stripHtml, withAngular };
 //# sourceMappingURL=slate-angular.mjs.map