slate-angular 20.2.0-next.12 → 20.2.0-next.13

package/fesm2022/slate-angular.mjs

@@ -3074,8 +3074,8 @@ const forceOnDOMPaste = IS_SAFARI;
 const isDebug = localStorage.getItem(SLATE_DEBUG_KEY) === 'true';
 class SlateEditable {
     set virtualScroll(config) {
-        this.virtualConfig = config;
-        this.doVirtualScroll();
+        this.virtualScrollConfig = config;
+        this.tryUpdateVirtualViewport();
     }
     get hasBeforeInputSupport() {
         return HAS_BEFORE_INPUT_SUPPORT;
@@ -3120,14 +3120,14 @@ class SlateEditable {
                 return null;
             }
         };
-        this.virtualConfig = {
+        this.virtualScrollConfig = {
             enabled: false,
             scrollTop: 0,
             viewportHeight: 0
         };
-        this.renderedChildren = [];
-        this.virtualVisibleIndexes = new Set();
-        this.measuredHeights = new Map();
+        this.inViewportChildren = [];
+        this.inViewportIndics = new Set();
+        this.keyHeightMap = new Map();
         // the height from scroll container top to editor top height element
         this.businessHeight = 0;
         this.virtualScrollInitialized = false;
@@ -3141,7 +3141,7 @@ class SlateEditable {
         NODE_TO_ELEMENT.set(this.editor, this.elementRef.nativeElement);
         ELEMENT_TO_NODE.set(this.elementRef.nativeElement, this.editor);
         IS_READ_ONLY.set(this.editor, this.readonly);
-        ELEMENT_KEY_TO_HEIGHTS.set(this.editor, this.measuredHeights);
+        ELEMENT_KEY_TO_HEIGHTS.set(this.editor, this.keyHeightMap);
         EDITOR_TO_ON_CHANGE.set(this.editor, () => {
             this.ngZone.run(() => {
                 this.onChange();
@@ -3155,7 +3155,7 @@ class SlateEditable {
         // add browser class
         let browserClass = IS_FIREFOX ? 'firefox' : IS_SAFARI ? 'safari' : '';
         browserClass && this.elementRef.nativeElement.classList.add(browserClass);
-        this.initializeVirtualScrolling();
+        this.initializeVirtualScroll();
         this.listRender = new ListRender(this.viewContext, this.viewContainerRef, this.getOutletParent, this.getOutletElement);
     }
     ngOnChanges(simpleChanges) {
@@ -3187,9 +3187,9 @@ class SlateEditable {
         if (value && value.length) {
             this.editor.children = value;
             this.initializeContext();
-            const virtualView = this.refreshVirtualView();
+            const virtualView = this.calculateVirtualViewport();
             this.applyVirtualView(virtualView);
-            const childrenForRender = virtualView.renderedChildren;
+            const childrenForRender = virtualView.inViewportChildren;
             if (!this.listRender.initialized) {
                 this.listRender.initialize(childrenForRender, this.editor, this.context);
             }
@@ -3230,8 +3230,8 @@ class SlateEditable {
     toNativeSelection() {
         try {
             let { selection } = this.editor;
-            if (this.virtualConfig?.enabled && selection) {
-                const indics = Array.from(this.virtualVisibleIndexes.values());
+            if (this.virtualScrollConfig?.enabled && selection) {
+                const indics = Array.from(this.inViewportIndics.values());
                 if (indics.length > 0) {
                     const currentVisibleRange = {
                         anchor: Editor.start(this.editor, [indics[0]]),
@@ -3335,10 +3335,10 @@ class SlateEditable {
     ngDoCheck() { }
     forceRender() {
         this.updateContext();
-        const virtualView = this.refreshVirtualView();
+        const virtualView = this.calculateVirtualViewport();
         this.applyVirtualView(virtualView);
-        const visibleIndexes = Array.from(this.virtualVisibleIndexes);
-        this.listRender.update(this.renderedChildren, this.editor, this.context);
+        const visibleIndexes = Array.from(this.inViewportIndics);
+        this.listRender.update(this.inViewportChildren, this.editor, this.context);
         this.remeasureHeightByIndics(visibleIndexes);
         // repair collaborative editing when Chinese input is interrupted by other users' cursors
         // when the DOMElement where the selection is located is removed
@@ -3378,9 +3378,9 @@ class SlateEditable {
     render() {
         const changed = this.updateContext();
         if (changed) {
-            const virtualView = this.refreshVirtualView();
+            const virtualView = this.calculateVirtualViewport();
             this.applyVirtualView(virtualView);
-            this.listRender.update(virtualView.renderedChildren, this.editor, this.context);
+            this.listRender.update(virtualView.inViewportChildren, this.editor, this.context);
             this.scheduleMeasureVisibleHeights();
         }
     }
@@ -3444,14 +3444,14 @@ class SlateEditable {
         decorations.push(...placeholderDecorations);
         return decorations;
     }
-    shouldUseVirtual() {
-        return !!(this.virtualConfig && this.virtualConfig.enabled);
+    isEnabledVirtualScroll() {
+        return !!(this.virtualScrollConfig && this.virtualScrollConfig.enabled);
     }
-    initializeVirtualScrolling() {
+    initializeVirtualScroll() {
         if (this.virtualScrollInitialized) {
             return;
         }
-        if (this.virtualConfig && this.virtualConfig.enabled) {
+        if (this.virtualScrollConfig && this.virtualScrollConfig.enabled) {
             this.virtualScrollInitialized = true;
             this.virtualTopHeightElement = document.createElement('div');
             this.virtualTopHeightElement.classList.add('virtual-top-height');
@@ -3469,7 +3469,7 @@ class SlateEditable {
             this.editorResizeObserver = new ResizeObserver(entries => {
                 if (entries.length > 0 && entries[0].contentRect.width !== editorResizeObserverRectWidth) {
                     editorResizeObserverRectWidth = entries[0].contentRect.width;
-                    this.remeasureHeightByIndics(Array.from(this.virtualVisibleIndexes));
+                    this.remeasureHeightByIndics(Array.from(this.inViewportIndics));
                 }
             });
             this.editorResizeObserver.observe(this.elementRef.nativeElement);
@@ -3479,7 +3479,7 @@ class SlateEditable {
             }
         }
     }
-    changeVirtualHeight(topHeight, bottomHeight) {
+    setVirtualSpaceHeight(topHeight, bottomHeight) {
         if (!this.virtualScrollInitialized) {
             return;
         }
@@ -3490,19 +3490,19 @@ class SlateEditable {
         const doc = this.elementRef?.nativeElement?.ownerDocument ?? document;
         VirtualScrollDebugOverlay.log(doc, type, ...args);
     }
-    doVirtualScroll() {
+    tryUpdateVirtualViewport() {
         this.refreshVirtualViewAnimId && cancelAnimationFrame(this.refreshVirtualViewAnimId);
         this.refreshVirtualViewAnimId = requestAnimationFrame(() => {
-            let virtualView = this.refreshVirtualView();
-            let diff = this.diffVirtualView(virtualView);
+            let virtualView = this.calculateVirtualViewport();
+            let diff = this.diffVirtualViewport(virtualView);
             if (!diff.isDiff) {
                 return;
             }
             if (diff.isMissingTop) {
                 const result = this.remeasureHeightByIndics(diff.diffTopRenderedIndexes);
                 if (result) {
-                    virtualView = this.refreshVirtualView();
-                    diff = this.diffVirtualView(virtualView, 'second');
+                    virtualView = this.calculateVirtualViewport();
+                    diff = this.diffVirtualViewport(virtualView, 'second');
                     if (!diff.isDiff) {
                         return;
                     }
@@ -3510,7 +3510,7 @@ class SlateEditable {
             }
             this.applyVirtualView(virtualView);
             if (this.listRender.initialized) {
-                this.listRender.update(virtualView.renderedChildren, this.editor, this.context);
+                this.listRender.update(virtualView.inViewportChildren, this.editor, this.context);
                 if (!AngularEditor.isReadOnly(this.editor) && this.editor.selection) {
                     this.toNativeSelection();
                 }
@@ -3518,26 +3518,26 @@ class SlateEditable {
             this.scheduleMeasureVisibleHeights();
         });
     }
-    refreshVirtualView() {
+    calculateVirtualViewport() {
         const children = (this.editor.children || []);
-        if (!children.length || !this.shouldUseVirtual()) {
+        if (!children.length || !this.isEnabledVirtualScroll()) {
             return {
-                renderedChildren: children,
+                inViewportChildren: children,
                 visibleIndexes: new Set(),
                 top: 0,
                 bottom: 0,
                 heights: []
             };
         }
-        const scrollTop = this.virtualConfig.scrollTop;
+        const scrollTop = this.virtualScrollConfig.scrollTop;
         if (isDebug) {
             const doc = this.elementRef?.nativeElement?.ownerDocument ?? document;
             VirtualScrollDebugOverlay.syncScrollTop(doc, Number.isFinite(scrollTop) ? scrollTop : 0);
         }
-        const viewportHeight = this.virtualConfig.viewportHeight ?? 0;
+        const viewportHeight = this.virtualScrollConfig.viewportHeight ?? 0;
         if (!viewportHeight) {
             return {
-                renderedChildren: [],
+                inViewportChildren: [],
                 visibleIndexes: new Set(),
                 top: 0,
                 bottom: 0,
@@ -3577,7 +3577,7 @@ class SlateEditable {
         const top = visibleStartIndex === -1 ? 0 : accumulatedHeights[visibleStartIndex];
         const bottom = totalHeight - accumulatedHeights[visibleEndIndex + 1];
         return {
-            renderedChildren: visible.length ? visible : children,
+            inViewportChildren: visible.length ? visible : children,
             visibleIndexes: new Set(visibleIndexes),
             top,
             bottom,
@@ -3585,19 +3585,19 @@ class SlateEditable {
         };
     }
     applyVirtualView(virtualView) {
-        this.renderedChildren = virtualView.renderedChildren;
-        this.changeVirtualHeight(virtualView.top, virtualView.bottom);
-        this.virtualVisibleIndexes = virtualView.visibleIndexes;
+        this.inViewportChildren = virtualView.inViewportChildren;
+        this.setVirtualSpaceHeight(virtualView.top, virtualView.bottom);
+        this.inViewportIndics = virtualView.visibleIndexes;
     }
-    diffVirtualView(virtualView, stage = 'first') {
-        if (!this.renderedChildren.length) {
+    diffVirtualViewport(virtualView, stage = 'first') {
+        if (!this.inViewportChildren.length) {
             return {
                 isDiff: true,
                 diffTopRenderedIndexes: [],
                 diffBottomRenderedIndexes: []
             };
         }
-        const oldVisibleIndexes = [...this.virtualVisibleIndexes];
+        const oldVisibleIndexes = [...this.inViewportIndics];
         const newVisibleIndexes = [...virtualView.visibleIndexes];
         const firstNewIndex = newVisibleIndexes[0];
         const lastNewIndex = newVisibleIndexes[newVisibleIndexes.length - 1];
@@ -3653,7 +3653,7 @@ class SlateEditable {
                 }
             }
             if (isDebug) {
-                this.debugLog('log', `====== diffVirtualView stage: ${stage} ======`);
+                this.debugLog('log', `====== diffVirtualViewport stage: ${stage} ======`);
                 this.debugLog('log', 'oldVisibleIndexes:', oldVisibleIndexes);
                 this.debugLog('log', 'newVisibleIndexes:', newVisibleIndexes);
                 this.debugLog('log', 'diffTopRenderedIndexes:', isMissingTop ? '-' : isAddedTop ? '+' : '-', diffTopRenderedIndexes, diffTopRenderedIndexes.map(index => this.getBlockHeight(index, 0)));
@@ -3692,11 +3692,11 @@ class SlateEditable {
             return defaultHeight;
         }
         const key = AngularEditor.findKey(this.editor, node);
-        const height = this.measuredHeights.get(key.id);
+        const height = this.keyHeightMap.get(key.id);
         if (typeof height === 'number') {
             return height;
         }
-        if (this.measuredHeights.has(key.id)) {
+        if (this.keyHeightMap.has(key.id)) {
             console.error('getBlockHeight: invalid height value', key.id, height);
         }
         return defaultHeight;
@@ -3710,7 +3710,7 @@ class SlateEditable {
         return accumulatedHeights;
     }
     scheduleMeasureVisibleHeights() {
-        if (!this.shouldUseVirtual()) {
+        if (!this.isEnabledVirtualScroll()) {
             return;
         }
         this.measureVisibleHeightsAnimId && cancelAnimationFrame(this.measureVisibleHeightsAnimId);
@@ -3720,14 +3720,14 @@ class SlateEditable {
     }
     measureVisibleHeights() {
         const children = (this.editor.children || []);
-        this.virtualVisibleIndexes.forEach(index => {
+        this.inViewportIndics.forEach(index => {
             const node = children[index];
             if (!node) {
                 return;
             }
             const key = AngularEditor.findKey(this.editor, node);
             // 跳过已测过的块，除非强制测量
-            if (this.measuredHeights.has(key.id)) {
+            if (this.keyHeightMap.has(key.id)) {
                 return;
             }
             const view = ELEMENT_TO_COMPONENT.get(node);
@@ -3737,11 +3737,11 @@ class SlateEditable {
             const ret = view.getRealHeight();
             if (ret instanceof Promise) {
                 ret.then(height => {
-                    this.measuredHeights.set(key.id, height);
+                    this.keyHeightMap.set(key.id, height);
                 });
             }
             else {
-                this.measuredHeights.set(key.id, ret);
+                this.keyHeightMap.set(key.id, ret);
             }
         });
     }
@@ -3758,12 +3758,12 @@ class SlateEditable {
             if (!view) {
                 return;
             }
-            const prevHeight = this.measuredHeights.get(key.id);
+            const prevHeight = this.keyHeightMap.get(key.id);
             const ret = view.getRealHeight();
             if (ret instanceof Promise) {
                 ret.then(height => {
                     if (height !== prevHeight) {
-                        this.measuredHeights.set(key.id, height);
+                        this.keyHeightMap.set(key.id, height);
                         isHeightChanged = true;
                         if (isDebug) {
                             this.debugLog('log', `remeasureHeightByIndics, index: ${index} prevHeight: ${prevHeight} newHeight: ${height}`);
@@ -3773,7 +3773,7 @@ class SlateEditable {
             }
             else {
                 if (ret !== prevHeight) {
-                    this.measuredHeights.set(key.id, ret);
+                    this.keyHeightMap.set(key.id, ret);
                     isHeightChanged = true;
                     if (isDebug) {
                         this.debugLog('log', `remeasureHeightByIndics, index: ${index} prevHeight: ${prevHeight} newHeight: ${ret}`);