Merge pull request #471 from webzard-io/fix/mask-scroll

fix(mask): fix the bug that mask location is wrong position when editor is scrolled
This commit is contained in:
yz-yu 2022-06-22 14:39:14 +08:00 committed by GitHub
commit b6c1f34967
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -142,8 +142,16 @@ export class EditorMaskManager {
return {
id,
style: {
top: rect.top - this.maskContainerRect.top - this.MaskPadding,
left: rect.left - this.maskContainerRect.left - this.MaskPadding,
top:
rect.top -
this.maskContainerRect.top -
this.MaskPadding +
this.wrapperScrollTop,
left:
rect.left -
this.maskContainerRect.left -
this.MaskPadding +
this.wrapperScrollLeft,
height: rect.height + this.MaskPadding * 2,
width: rect.width + this.MaskPadding * 2,
},
@ -161,7 +169,10 @@ export class EditorMaskManager {
}
private refreshHoverElement() {
const hoverElement = document.elementFromPoint(...this.mousePosition);
const hoverElement = document.elementFromPoint(
this.mousePosition[0] - this.wrapperScrollLeft,
this.mousePosition[1] - this.wrapperScrollTop
);
if (!hoverElement) return;
if (hoverElement === this.lastHoverElement) return;
const root = this.wrapperRef.current;
@ -210,6 +221,14 @@ export class EditorMaskManager {
private get eleMap() {
return this.services.editorStore.eleMap;
}
private get wrapperScrollTop() {
return this.wrapperRef.current?.scrollTop || 0;
}
private get wrapperScrollLeft() {
return this.wrapperRef.current?.scrollLeft || 0;
}
}
function buildThresholdList() {