suneditor 3.0.0-beta.3 → 3.0.0-beta.30

package/src/core/class/offset.js

@@ -43,10 +43,10 @@ import { _w, _d } from '../../helper/env';
  * @typedef {Object} OffsetGlobalInfo
  * @property {number} top - The top position of the element relative to the entire document.
  * @property {number} left - The left position of the element relative to the entire document.
+ * @property {number} fixedTop - The top position within the current viewport, without taking scrolling into account.
+ * @property {number} fixedLeft - The left position within the current viewport, without taking scrolling into account.
  * @property {number} width - The total width of the element, including its content, padding, and border.
  * @property {number} height - The total height of the element, including its content, padding, and border.
- * @property {number} scrollTop - The amount of vertical scrolling applied to the element.
- * @property {number} scrollLeft - The amount of horizontal scrolling applied to the element.
  */
 
 /**
@@ -85,12 +85,6 @@ import { _w, _d } from '../../helper/env';
  */
 function Offset(editor) {
 	CoreInjector.call(this, editor);
-
-	// members
-	this._scrollEvent = null;
-	this._elTop = 0;
-	this._scrollY = 0;
-	this._isFixed = false;
 }
 
 Offset.prototype = {
@@ -101,7 +95,7 @@ Offset.prototype = {
 	 * @returns {OffsetInfo} Position relative to the editor frame.
 	 */
 	get(node) {
-		const wFrame = this.editor.frameContext.get('wysiwygFrame');
+		const wFrame = this.frameContext.get('wysiwygFrame');
 		const iframe = /iframe/i.test(wFrame?.nodeName);
 		const off = this.getLocal(node);
 
@@ -135,75 +129,70 @@ Offset.prototype = {
 			offsetElement = /** @type {HTMLElement} */ (offsetElement.offsetParent);
 		}
 
-		const wwFrame = this.editor.frameContext.get('wysiwygFrame');
-		if (this.editor.frameContext.get('wysiwyg').contains(target)) {
+		const wwFrame = this.frameContext.get('wysiwygFrame');
+		if (this.frameContext.get('wysiwyg').contains(target)) {
 			l = wwFrame.offsetLeft;
 			t = wwFrame.offsetTop;
 			r = wwFrame.parentElement.offsetWidth - (wwFrame.offsetLeft + wwFrame.offsetWidth);
 		}
 
-		const eventWysiwyg = this.editor.frameContext.get('eventWysiwyg');
-		offsetLeft += l;
+		const eventWysiwyg = this.frameContext.get('eventWysiwyg');
+		offsetLeft += l - (wysiwyg ? wysiwyg.scrollLeft : 0);
 		offsetTop += t - (wysiwyg ? wysiwyg.scrollTop : 0);
 		return {
 			left: offsetLeft,
 			top: offsetTop,
 			right: offsetElement?.offsetWidth ? offsetElement.offsetWidth - (offsetLeft - l + targetWidth) + r : 0,
-			scrollX: eventWysiwyg.scrollX || eventWysiwyg.scrollLeft || 0,
-			scrollY: eventWysiwyg.scrollY || eventWysiwyg.scrollTop || 0
+			scrollX: eventWysiwyg.scrollLeft || eventWysiwyg.scrollX || 0,
+			scrollY: eventWysiwyg.scrollTop || eventWysiwyg.scrollY || 0
 		};
 	},
 
 	/**
 	 * @this {OffsetThis}
 	 * @description Returns the position of the argument relative to the global document.
+	 * This is a refactored version using getBoundingClientRect for better performance and accuracy.
 	 * @param {?Node=} node Target element.
 	 * @returns {OffsetGlobalInfo} Global position and scroll values.
 	 */
 	getGlobal(node) {
-		const topArea = this.editor.frameContext.get('topArea');
-		const wFrame = this.editor.frameContext.get('wysiwygFrame');
+		const topArea = this.frameContext.get('topArea');
+		const wFrame = this.frameContext.get('wysiwygFrame');
 
-		let isTop = false;
-		let targetAbs = false;
-		if (!node) node = topArea;
-		if (node === topArea) isTop = true;
-		if (!isTop && isElement(node)) {
-			targetAbs = _w.getComputedStyle(node).position === 'absolute';
+		node ||= topArea;
+
+		if (!isElement(node)) {
+			return { top: 0, left: 0, fixedTop: 0, fixedLeft: 0, width: 0, height: 0 };
 		}
 
-		let element = /** @type {HTMLElement} */ (node);
-		const w = element.offsetWidth;
-		const h = element.offsetHeight;
-		let t = 0,
-			l = 0,
-			st = 0,
-			sl = 0;
-
-		while (element) {
-			t += element.offsetTop;
-			l += element.offsetLeft;
-			st += element.scrollTop;
-			sl += element.scrollLeft;
-			element = /** @type {HTMLElement} */ (element.offsetParent);
+		const element = /** @type {HTMLElement} */ (node);
+
+		const rect = element.getBoundingClientRect();
+
+		let top = rect.top;
+		let left = rect.left;
+
+		const isIframe = /^iframe$/i.test(wFrame.nodeName);
+		if (isIframe && wFrame.contentDocument.contains(element)) {
+			const iframeRect = wFrame.getBoundingClientRect();
+			top += iframeRect.top;
+			left += iframeRect.left;
 		}
 
-		if (!targetAbs && !isTop && /^iframe$/i.test(wFrame.nodeName) && this.editor.frameContext.get('wysiwyg').contains(element)) {
-			element = this.editor.frameContext.get('wrapper');
-			while (element) {
-				t += element.offsetTop;
-				l += element.offsetLeft;
-				element = /** @type {HTMLElement} */ (element.offsetParent);
-			}
+		let wy = 0;
+		let wx = 0;
+		if (!this.frameContext.get('isFullScreen')) {
+			wy += _w.scrollY;
+			wx += _w.scrollX;
 		}
 
 		return {
-			top: t + st,
-			left: l + sl,
-			width: w,
-			height: h,
-			scrollTop: st,
-			scrollLeft: sl
+			top: top + wy,
+			left: left + wx,
+			fixedTop: top,
+			fixedLeft: left,
+			width: element.offsetWidth,
+			height: element.offsetHeight
 		};
 	},
 
@@ -214,10 +203,10 @@ Offset.prototype = {
 	 * @returns {OffsetGlobalScrollInfo} Global scroll information.
 	 */
 	getGlobalScroll(node) {
-		const topArea = this.editor.frameContext.get('topArea');
+		const topArea = this.frameContext.get('topArea');
 		let isTop = false;
 		let targetAbs = false;
-		if (!node) node = topArea;
+		node ||= topArea;
 		if (node === topArea) isTop = true;
 		if (!isTop && isElement(node)) {
 			targetAbs = _w.getComputedStyle(node).position === 'absolute';
@@ -262,8 +251,8 @@ Offset.prototype = {
 			el = el.parentElement;
 		}
 
-		if (!targetAbs && !isTop && /^iframe$/i.test(this.editor.frameContext.get('wysiwygFrame').nodeName)) {
-			el = this.editor.frameContext.get('wrapper');
+		if (!targetAbs && !isTop && /^iframe$/i.test(this.frameContext.get('wysiwygFrame').nodeName)) {
+			el = this.frameContext.get('wrapper');
 			ohOffsetEl = owOffsetEl = topArea;
 			while (el) {
 				t += el.scrollTop;
@@ -288,7 +277,7 @@ Offset.prototype = {
 			}
 		}
 
-		el = /** @type {HTMLElement} */ (this._shadowRoot?.host);
+		el = /** @type {HTMLElement} */ (this.editor._shadowRoot?.host);
 		if (el) ohOffsetEl = owOffsetEl = topArea;
 		while (el) {
 			t += el.scrollTop;
@@ -322,7 +311,7 @@ Offset.prototype = {
 		oh = heightEditorRefer ? topArea.clientHeight : oh;
 		ow = widthEditorRefer ? topArea.clientWidth : ow;
 
-		const clientSize = getClientSize(this.editor.frameContext.get('_wd'));
+		const clientSize = getClientSize(this.frameContext.get('_wd'));
 		return {
 			top: t,
 			left: l,
@@ -347,15 +336,15 @@ Offset.prototype = {
 	 * @returns {OffsetWWScrollInfo} Scroll information within the editor.
 	 */
 	getWWScroll() {
-		const eventWysiwyg = this.editor.frameContext.get('wysiwyg');
+		const eventWysiwyg = this.frameContext.get('wysiwyg');
 		const rects = this.selection.getRects(eventWysiwyg, 'start').rects;
-		const top = eventWysiwyg.scrollY || eventWysiwyg.scrollTop || 0;
-		const height = eventWysiwyg.scrollHeight || 0;
+		const top = eventWysiwyg.scrollTop || eventWysiwyg.scrollY || 0;
+		const height = eventWysiwyg.scrollHeight || eventWysiwyg.document?.documentElement.scrollHeight || 0;
 
 		return {
 			top,
-			left: eventWysiwyg.scrollX || eventWysiwyg.scrollLeft || 0,
-			width: eventWysiwyg.scrollWidth || 0,
+			left: eventWysiwyg.scrollLeft || eventWysiwyg.scrollX || 0,
+			width: eventWysiwyg.scrollWidth || eventWysiwyg.document?.documentElement.scrollWidth || 0,
 			height,
 			bottom: top + height,
 			rects
@@ -369,30 +358,50 @@ Offset.prototype = {
 	 * @param {HTMLElement} e_container Element's root container
 	 * @param {HTMLElement} target Target element to position against
 	 * @param {HTMLElement} t_container Target's root container
-	 * @param {boolean} _reload Whether to reload position
 	 */
-	setRelPosition(element, e_container, target, t_container, _reload) {
-		this._scrollY = _w.scrollY;
-		let wy = 0;
-		let tCon = t_container;
-		do {
-			if ((this._isFixed = /^fixed$/i.test(_w.getComputedStyle(tCon).position))) {
-				wy += this._scrollY;
-				break;
-			}
-		} while (!hasClass(tCon, 'sun-editor') && (tCon = tCon.parentElement));
+	setRelPosition(element, e_container, target, t_container) {
+		const isFixedContainer = /^fixed$/i.test(_w.getComputedStyle(t_container).position);
+		const tGlobal = this.getGlobal(target);
+
+		// top
+		if (isFixedContainer) {
+			element.style.position = 'fixed';
+			element.style.top = `${tGlobal.fixedTop + tGlobal.height}px`;
+		} else {
+			element.style.position = '';
+
+			const isSameContainer = t_container.contains(element);
+			const containerTop = isSameContainer ? this.getGlobal(e_container).top : 0;
+			const elHeight = element.offsetHeight;
+			const scrollTop = this.getGlobalScroll().top;
+			const bt = tGlobal.top;
+
+			const menuHeight_bottom = getClientSize(_d).h - (containerTop - scrollTop + bt + target.offsetHeight);
+			if (menuHeight_bottom < elHeight) {
+				let menuTop = -1 * (elHeight - bt + 3);
+				const insTop = containerTop - scrollTop + menuTop;
+				const menuHeight_top = elHeight + (insTop < 0 ? insTop : 0);
+
+				if (menuHeight_top > menuHeight_bottom) {
+					element.style.height = `${menuHeight_top}px`;
+					menuTop = -1 * (menuHeight_top - bt + 3);
+				} else {
+					element.style.height = `${menuHeight_bottom}px`;
+					menuTop = bt + target.offsetHeight;
+				}
 
-		if (!_reload) {
-			this.__removeGlobalEvent();
-			this._scrollEvent = this.editor.eventManager.addGlobalEvent('scroll', FixedScroll.bind(this, element, e_container, target, t_container), false);
+				element.style.top = `${menuTop}px`;
+			} else {
+				element.style.top = `${bt + target.offsetHeight}px`;
+			}
 		}
 
+		// left
 		const ew = element.offsetWidth;
 		const tw = target.offsetWidth;
-		const tl = this.getGlobal(target).left;
+		const tl = tGlobal.left;
 		const tcleft = this.getGlobal(t_container).left;
 
-		// left
 		if (this.options.get('_rtl')) {
 			const rtlW = ew > tw ? ew - tw : 0;
 			const rtlL = rtlW > 0 ? 0 : tw - ew;
@@ -406,41 +415,6 @@ Offset.prototype = {
 			if (overLeft < 0) element.style.left = `${tl + overLeft + tcleft}px`;
 			else element.style.left = `${tl}px`;
 		}
-
-		// top
-		const isSameContainer = t_container.contains(element);
-		const containerTop = isSameContainer ? this.getGlobal(e_container).top : 0;
-		const elHeight = element.offsetHeight;
-		const scrollTop = this.getGlobalScroll().top;
-		let bt = wy;
-		let offsetEl = target;
-		while (offsetEl && offsetEl !== e_container) {
-			bt += offsetEl.offsetTop;
-			offsetEl = /** @type {HTMLElement} */ (offsetEl.offsetParent);
-		}
-
-		const menuHeight_bottom = getClientSize(_d).h - (containerTop - scrollTop + bt + target.offsetHeight);
-		if (menuHeight_bottom < elHeight) {
-			let menuTop = -1 * (elHeight - bt + 3);
-			const insTop = containerTop - scrollTop + menuTop;
-			const menuHeight_top = elHeight + (insTop < 0 ? insTop : 0);
-
-			if (menuHeight_top > menuHeight_bottom) {
-				element.style.height = `${menuHeight_top}px`;
-				menuTop = -1 * (menuHeight_top - bt + 3);
-			} else {
-				element.style.height = `${menuHeight_bottom}px`;
-				menuTop = bt + target.offsetHeight;
-			}
-
-			element.style.top = `${menuTop}px`;
-		} else {
-			element.style.top = `${bt + target.offsetHeight}px`;
-		}
-
-		if (this._isFixed) {
-			this._elTop = element.offsetTop;
-		}
 	},
 
 	/**
@@ -453,6 +427,7 @@ Offset.prototype = {
 	 * @param {{left:number, top:number}} [params.addOffset={left:0, top:0}] Additional offset
 	 * @param {"bottom"|"top"} [params.position="bottom"] Position ('bottom'|'top')
 	 * @param {*} params.inst Instance object of caller
+	 * @param {HTMLElement} [params.sibling] The sibling controller element
 	 * @returns {{position: "top" | "bottom"} | undefined} Success -> {position: current position}
 	 */
 	setAbsPosition(element, target, params) {
@@ -469,55 +444,76 @@ Offset.prototype = {
 			addOffset.left *= -1;
 		}
 
-		const isWWTarget = this.editor.frameContext.get('wrapper').contains(target) || params.isWWTarget;
-		const isCtrlTarget = getParentElement(target, '.se-controller');
+		const isIframe = this.frameOptions.get('iframe');
+		const isWWTarget = this.frameContext.get('wrapper').contains(target) || params.isWWTarget || (isIframe ? this.frameContext.get('wysiwyg').contains(target) : false);
+
+		const isCtrlTarget = target.nodeType === 1;
 		const isTargetAbs = isWWTarget && !isCtrlTarget;
+		const isInlineTarget = isCtrlTarget && /inline/.test(_w.getComputedStyle(target).display);
 		const clientSize = getClientSize(_d);
 		const wwScroll = isTargetAbs ? this.getWWScroll() : this._getWindowScroll();
-		const targetRect = isCtrlTarget ? target.getBoundingClientRect() : this.selection.getRects(target, 'start').rects;
+		const targetRect = !isIframe && isCtrlTarget ? target.getBoundingClientRect() : this.selection.getRects(target, 'start').rects;
 		const targetOffset = this.getGlobal(target);
 		const arrow = /** @type {HTMLElement} */ (hasClass(element.firstElementChild, 'se-arrow') ? element.firstElementChild : null);
 
 		// top ----------------------------------------------------------------------------------------------------
+		const siblingH = params.sibling?.offsetHeight || 0;
 		const ah = arrow ? arrow.offsetHeight : 0;
 		const elH = element.offsetHeight;
 		const targetH = target.offsetHeight;
 		// margin
 		const tmtw = targetRect.top;
 		const tmbw = clientSize.h - targetRect.bottom;
-		const toolbarH = !this.editor.toolbar._sticky && (this.editor.isBalloon || this.editor.isInline) ? 0 : this.context.get('toolbar.main').offsetHeight;
+		const globalTop = this.getGlobal(this.frameContext.get('topArea')).top;
+		const wScrollY = _w.scrollY;
+		const th = this.context.get('toolbar_main').offsetHeight;
+		const containerToolbar = this.options.get('toolbar_container');
+		const headLess = this.editor.isBalloon || this.editor.isInline || containerToolbar;
+		const toolbarH = (containerToolbar && globalTop - wScrollY - th > 0) || (!this.editor.toolbar._sticky && headLess) ? 0 : th;
 
 		// check margin
-		const { rmt, rmb, rt } = this._getVMargin(tmtw, tmbw, toolbarH, clientSize, targetRect, isTargetAbs, wwScroll);
-		if (isWWTarget && (rmb + targetH <= 0 || rmt + rt + targetH <= 0)) return;
+		const { rmt, rmb, bMargin, rt } = this._getVMargin(tmtw, tmbw, toolbarH, clientSize, targetRect, isTargetAbs, wwScroll);
+		if (isWWTarget && ((rmb > 0 ? bMargin : rmb) + targetH <= 0 || rmt + rt + targetH - (this.editor.toolbar._sticky && isInlineTarget ? toolbarH : 0) <= 0)) return;
 
+		const isSticky = this.editor.toolbar._sticky && this.context.get('toolbar_main').style.display !== 'none' && (!headLess || this.frameContext.get('topArea').getBoundingClientRect().top <= th);
+		const statusBarH = this.frameContext.get('statusbar')?.offsetHeight || 0;
 		let t = addOffset.top;
 		let y = 0;
 		let arrowDir = '';
+
+		// [bottom] position
 		if (position === 'bottom') {
+			let trmt = rmt - (isSticky && globalTop - wScrollY <= toolbarH ? toolbarH : 0);
+			if (isSticky && trmt + toolbarH < 0) trmt += toolbarH;
 			arrowDir = 'up';
-			t += targetRect.bottom + ah + _w.scrollY;
-			y = rmb - (elH + ah);
-			if (y < 0) {
+			t += targetRect.bottom + ah + wScrollY;
+			y = rmb - (elH + ah) - statusBarH;
+			// change to <top> position
+			if (y - siblingH < 0) {
 				arrowDir = 'down';
 				t -= targetH + elH + ah * 2;
-				y = toolbarH + rmt - (elH + ah);
-				if (y < 0) {
+				y = trmt - (elH + ah);
+				// sticky the <top> position
+				if (y - siblingH < 0) {
 					arrowDir = '';
-					t -= y;
+					t -= y - siblingH - Math.max(1, y + elH + ah) + (!isSticky && trmt < 0 ? toolbarH : 0) - (isSticky ? this.context.get('toolbar_main').offsetTop : 0);
 				}
 			}
-		} else {
+		}
+		// <top> position
+		else {
 			arrowDir = 'down';
-			t += targetRect.top - elH - ah + _w.scrollY;
-			y = rmt - (elH + ah);
-			if (y < 0) {
+			t += targetRect.top - elH - ah + wScrollY;
+			y = (isSticky ? targetRect.top - toolbarH : rmt) - elH - ah;
+			// change to [bottom] position
+			if (y - siblingH < 0) {
 				arrowDir = 'up';
 				t += targetH + elH + ah * 2;
-				y = rmb - (elH + ah);
-				if (y < 0) {
+				y = (rmb > 0 ? bMargin : rmb) - (elH + ah) - statusBarH;
+				// sticky the [bottom] position
+				if (y - siblingH < 0) {
 					arrowDir = '';
-					t += y;
+					t += y - 2;
 				}
 			}
 		}
@@ -534,7 +530,7 @@ Offset.prototype = {
 		const tmlw = targetRect.left;
 		const tmrw = clientSize.w - targetRect.right;
 		let rml, rmr;
-		if (this.editor.frameContext.get('isFullScreen')) {
+		if (this.frameContext.get('isFullScreen')) {
 			rml = tmlw;
 			rmr = tmrw;
 		} else {
@@ -611,12 +607,12 @@ Offset.prototype = {
 		element.style.display = 'block';
 
 		let positionTop = position === 'top';
-		range = range || this.selection.getRange();
+		range ||= this.selection.getRange();
 		const rectsObj = this.selection.getRects(range, positionTop ? 'start' : 'end');
 		positionTop = rectsObj.position === 'start';
 
-		const isFullScreen = this.editor.frameContext.get('isFullScreen');
-		const topArea = this.editor.frameContext.get('topArea');
+		const isFullScreen = this.frameContext.get('isFullScreen');
+		const topArea = this.frameContext.get('topArea');
 		const rects = rectsObj.rects;
 		const scrollLeft = isFullScreen ? 0 : rectsObj.scrollLeft;
 		const scrollTop = isFullScreen ? 0 : rectsObj.scrollTop;
@@ -643,7 +639,7 @@ Offset.prototype = {
 		const targetH = rects.height;
 		const tmtw = rects.top;
 		const tmbw = clientSize.h - rects.bottom;
-		const toolbarH = !this.editor.toolbar._sticky && (this.editor.isBalloon || this.editor.isInline) ? 0 : this.context.get('toolbar.main').offsetHeight;
+		const toolbarH = !this.editor.toolbar._sticky && (this.editor.isBalloon || this.editor.isInline) ? 0 : this.context.get('toolbar_main').offsetHeight;
 
 		const { rmt, rmb, rt } = this._getVMargin(tmtw, tmbw, toolbarH, clientSize, rects, isTargetAbs, wwScroll);
 		if (rmb + targetH <= 0 || rmt + rt + targetH <= 0) return;
@@ -684,7 +680,7 @@ Offset.prototype = {
 		const l = absoluteLeft < 0 ? padding : overRight < 0 ? absoluteLeft : absoluteLeft - overRight - padding - 1;
 
 		let resetTop = false;
-		const space = t + (isDirTop ? this.getGlobal(this.editor.frameContext.get('topArea')).top : element.offsetHeight - this.editor.frameContext.get('wysiwyg').offsetHeight);
+		const space = t + (isDirTop ? this.getGlobal(this.frameContext.get('topArea')).top : element.offsetHeight - this.frameContext.get('wysiwyg').offsetHeight);
 		if (!isDirTop && space > 0 && this._getPageBottomSpace() < space) {
 			isDirTop = true;
 			resetTop = true;
@@ -717,7 +713,7 @@ Offset.prototype = {
 	 * @returns {number} Available space
 	 */
 	_getPageBottomSpace() {
-		const topArea = this.editor.frameContext.get('topArea');
+		const topArea = this.frameContext.get('topArea');
 		return _d.documentElement.scrollHeight - (this.getGlobal(topArea).top + topArea.offsetHeight);
 	},
 
@@ -734,59 +730,66 @@ Offset.prototype = {
 	 * @param {RectsInfo} targetRect Target rect object
 	 * @param {boolean} isTargetAbs Is target absolute position
 	 * @param {OffsetWWScrollInfo} wwScroll WYSIWYG scroll info
-	 * @returns {{rmt:number, rmb:number, rt:number}} Margin values (rmt: top margin, rmb: bottom margin, rt: Toolbar height offset adjustment)
+	 * @returns {{rmt:number, rmb:number, rt:number, tMargin:number, bMargin:number}} Margin values
+	 * - rmt: top margin to frame
+	 * - rmb: bottom margin to frame
+	 * - rt: Toolbar height offset adjustment
+	 * - tMargin: top margin
+	 * - bMargin: bottom margin
 	 */
 	_getVMargin(tmtw, tmbw, toolbarH, clientSize, targetRect, isTargetAbs, wwScroll) {
 		let rmt = 0;
 		let rmb = 0;
 		let rt = 0;
-		if (this.editor.frameContext.get('isFullScreen')) {
+		let tMargin = 0;
+		let bMargin = 0;
+
+		if (this.frameContext.get('isFullScreen')) {
 			rmt = tmtw - toolbarH;
 			rmb = tmbw;
 		} else {
-			const isIframe = isTargetAbs && this.editor.frameOptions.get('iframe');
-			const tMargin = targetRect.top;
-			const bMargin = clientSize.h - targetRect.bottom;
+			const isIframeAbs = isTargetAbs && this.frameOptions.get('iframe');
+			tMargin = targetRect.top;
+			bMargin = clientSize.h - targetRect.bottom;
 			const editorOffset = this.getGlobal();
 			const editorScroll = this.getGlobalScroll();
-			const statusBarH = this.editor.frameContext.get('statusbar')?.offsetHeight || 0;
+			const statusBarH = this.frameContext.get('statusbar')?.offsetHeight || 0;
 
-			if (isIframe) {
+			if (isIframeAbs) {
 				const emt = editorOffset.top - editorScroll.top - editorScroll.ts;
-				const editorH = this.editor.frameContext.get('topArea').offsetHeight;
+				const editorH = this.frameContext.get('topArea').offsetHeight;
 				rmt = targetRect.top - emt;
 				rmb = bMargin - (editorScroll.oh - (editorH + emt) + statusBarH);
 			} else {
 				rt = !this.editor.toolbar._sticky && !this.options.get('toolbar_container') ? toolbarH : 0;
-				const wst = !isTargetAbs && /\d+/.test(this.editor.frameOptions.get('height')) ? editorOffset.top - _w.scrollY + rt : 0;
-				const wsb = !isTargetAbs && /\d+/.test(this.editor.frameOptions.get('height')) ? _w.innerHeight - (editorOffset.top + editorOffset.height - _w.scrollY) : 0;
+				const wst = !isTargetAbs && /\d+/.test(this.frameOptions.get('height')) ? editorOffset.top - _w.scrollY + rt : 0;
+				const wsb = !isTargetAbs && /\d+/.test(this.frameOptions.get('height')) ? this.status.currentViewportHeight - (editorOffset.top + editorOffset.height - _w.scrollY) : 0;
 				let st = wst;
 				if (toolbarH > wst) {
 					if (this.editor.toolbar._sticky) {
 						st = toolbarH;
-						toolbarH = 0;
 					} else {
 						st = wst + toolbarH;
 					}
-				} else if (this.options.get('toolbar_container')) {
+				} else if (this.options.get('toolbar_container') && !this.editor.toolbar._sticky) {
 					toolbarH = 0;
 				} else {
-					st = wst + (this.editor.toolbar._sticky ? toolbarH : 0);
+					st = wst + toolbarH;
 				}
 
-				rmt = targetRect.top - st;
-				rmb = wwScroll.rects.bottom - targetRect.bottom - wsb - statusBarH;
+				rmt = targetRect.top - wwScroll.rects.top - st + toolbarH;
+				rmb = wwScroll.rects.bottom - targetRect.bottom - wsb;
+				// display margin
+				rmt = rmt > 0 ? rmt : rmt - toolbarH;
 			}
-
-			// display margin
-			rmt = (rmt > 0 ? tMargin : rmt) - toolbarH;
-			rmb = rmb > 0 ? bMargin : rmb;
 		}
 
 		return {
 			rmt,
 			rmb,
-			rt
+			rt,
+			tMargin,
+			bMargin
 		};
 	},
 
@@ -829,7 +832,6 @@ Offset.prototype = {
 	 *   rects: RectsInfo
 	 * }} An object with scroll and viewport information.
 	 */
-
 	_getWindowScroll() {
 		const viewPort = getClientSize(_d);
 		return {
@@ -842,50 +844,13 @@ Offset.prototype = {
 				left: 0,
 				top: 0,
 				right: _w.innerWidth,
-				bottom: _w.innerHeight,
+				bottom: this.status.currentViewportHeight || _w.innerHeight,
 				noText: true
 			}
 		};
 	},
 
-	/**
-	 * @private
-	 * @this {OffsetThis}
-	 * @description Removes the global scroll event listener from the editor.
-	 * - Resets related scroll tracking properties.
-	 */
-	__removeGlobalEvent() {
-		if (this._scrollEvent) {
-			this._scrollEvent = this.editor.eventManager.removeGlobalEvent(this._scrollEvent);
-			this._scrollY = 0;
-			this._elTop = null;
-		}
-	},
-
 	constructor: Offset
 };
 
-/**
- * @private
- * @this {OffsetThis}
- * @param {HTMLElement} element - The element to check for a specific class name.
- * @param {HTMLElement} e_container - The root container of the element.
- * @param {HTMLElement} target - The target element to position against.
- * @param {HTMLElement} t_container - The root container of the target element.
- */
-function FixedScroll(element, e_container, target, t_container) {
-	const isFixed = /^fixed$/i.test(_w.getComputedStyle(t_container).position);
-	if (!this._isFixed) {
-		if (isFixed) {
-			this.setRelPosition(element, e_container, target, t_container, true);
-		}
-		return;
-	} else if (!isFixed) {
-		this.setRelPosition(element, e_container, target, t_container, true);
-		return;
-	}
-
-	element.style.top = `${this._elTop - (this._scrollY - _w.scrollY - t_container.offsetTop)}px`;
-}
-
 export default Offset;