@taocompany/magic-grid 0.12.4 → 0.12.5

package/dist/index.es.js

@@ -2503,7 +2503,7 @@ function zs(e) {
 }
 //#endregion
 //#region src/core/types/loadMoreRow.ts
-var Bs = "__MG_LOAD_MORE__", Vs = ji(Ci), Hs = "mg-full-width-row--load-more", Us = "mg-full-width-row__load-more-viewport";
+var Bs = "__MG_LOAD_MORE__", Vs = ji(Ci), Hs = "mg-full-width-row--load-more", Us = "mg-full-width-row__load-more-anchor";
 function Ws(e = {}) {
 	return {
 		loadMore: e.loadMore?.trim() || "加载更多",
@@ -12420,15 +12420,16 @@ function Db(e, t) {
 }
 var Ob = class {
 	element;
-	viewportEl;
 	contentEl;
-	frameService;
 	onUnmountRenderer;
 	loadMoreRowRenderer;
 	rowNode = null;
 	renderParams = null;
+	layoutTop = NaN;
 	constructor(e, t = {}) {
-		this.frameService = t.frameService ?? null, this.onUnmountRenderer = t.onUnmountRenderer, this.element = document.createElement("div"), this.element.className = `${St} ${Hs}`, this.element.dataset.rowKind = "LOAD_MORE", this.viewportEl = document.createElement("div"), this.viewportEl.className = Us, this.contentEl = document.createElement("div"), this.contentEl.className = Ct, this.viewportEl.appendChild(this.contentEl), this.element.appendChild(this.viewportEl), e.appendChild(this.element);
+		this.onUnmountRenderer = t.onUnmountRenderer, this.element = document.createElement("div"), this.element.className = `${St} ${Hs}`, this.element.dataset.rowKind = "LOAD_MORE";
+		let n = document.createElement("div");
+		n.className = Us, this.contentEl = document.createElement("div"), this.contentEl.className = Ct, n.appendChild(this.contentEl), this.element.appendChild(n), e.appendChild(this.element);
 	}
 	setLoadMoreRowRenderer(e) {
 		this.loadMoreRowRenderer = e, this.renderParams && this.renderContent(this.renderParams);
@@ -12445,18 +12446,15 @@ var Ob = class {
 	syncRowLayout(e) {
 		this.rowNode = e, this.element.style.height = `${e.rowHeight}px`;
 	}
-	syncViewportWidth(e) {
-		this.viewportEl.style.width = `${e}px`;
-	}
 	setRowTop(e) {
-		this.element.style.transform = `translateY(${e}px)`;
+		let t = Math.round(e);
+		t !== this.layoutTop && (this.layoutTop = t, this.element.style.transform = `translate3d(0, ${t}px, 0)`);
 	}
 	destroy() {
 		this.onUnmountRenderer?.(this.contentEl), this.contentEl.replaceChildren(), this.element.remove(), this.rowNode = null, this.renderParams = null;
 	}
 	renderContent(e) {
 		ic(this.contentEl, e, this.loadMoreRowRenderer, {
-			frameService: this.frameService,
 			onUnmountRenderer: this.onUnmountRenderer,
 			rowIndex: this.rowNode?.rowIndex ?? 0
 		});
@@ -12478,9 +12476,7 @@ var Ob = class {
 }, Ab = class {
 	container;
 	rowModel;
-	columnModel;
 	rowPool = new kb();
-	frameService;
 	onUnmountRenderer;
 	getLoadMoreRowEnabled;
 	getLoadMoreRowRenderer;
@@ -12490,14 +12486,13 @@ var Ob = class {
 	getLoadMoreRowLabels;
 	onLoadMore;
 	getApi;
-	getViewportClientWidth;
 	compressedScroll = !1;
 	scrollTop = 0;
 	invokeLoadMore = () => {
 		this.onLoadMore?.();
 	};
 	constructor(e) {
-		this.container = e.container, this.rowModel = e.rowModel, this.columnModel = e.columnModel, this.frameService = e.frameService ?? null, this.onUnmountRenderer = e.onUnmountRenderer, this.getLoadMoreRowEnabled = e.getLoadMoreRowEnabled, this.getLoadMoreRowRenderer = e.getLoadMoreRowRenderer, this.getLoadMoreRowLoading = e.getLoadMoreRowLoading, this.getLoadMoreRowHasMore = e.getLoadMoreRowHasMore, this.getLoadMoreRowGridSize = e.getLoadMoreRowGridSize, this.getLoadMoreRowLabels = e.getLoadMoreRowLabels, this.onLoadMore = e.onLoadMore, this.getApi = e.getApi, this.getViewportClientWidth = e.getViewportClientWidth;
+		this.container = e.container, this.rowModel = e.rowModel, this.onUnmountRenderer = e.onUnmountRenderer, this.getLoadMoreRowEnabled = e.getLoadMoreRowEnabled, this.getLoadMoreRowRenderer = e.getLoadMoreRowRenderer, this.getLoadMoreRowLoading = e.getLoadMoreRowLoading, this.getLoadMoreRowHasMore = e.getLoadMoreRowHasMore, this.getLoadMoreRowGridSize = e.getLoadMoreRowGridSize, this.getLoadMoreRowLabels = e.getLoadMoreRowLabels, this.onLoadMore = e.onLoadMore, this.getApi = e.getApi;
 	}
 	setCompressedScroll(e) {
 		this.compressedScroll = e;
@@ -12522,7 +12517,7 @@ var Ob = class {
 			return;
 		}
 		if (this.rowPool.get()) {
-			this.syncLoadMoreRowLayout(i);
+			this.applyLoadMoreRowLayout(i);
 			return;
 		}
 		this.updateLoadMoreRow(i);
@@ -12534,17 +12529,20 @@ var Ob = class {
 		!t || t.rowKind !== "LOAD_MORE" || this.updateLoadMoreRow(t);
 	}
 	syncColumnLayouts() {
-		this.rowPool.get()?.syncViewportWidth(this.resolveLoadMoreViewportWidth());
+		this.syncVisibleRowLayouts();
 	}
 	syncVisibleRowLayouts() {
 		let e = this.rowModel.getRowCount();
 		if (e === 0) return;
 		let t = this.rowModel.getRow(e - 1);
-		!t || !qs(t) || !this.rowPool.get() || this.syncLoadMoreRowLayout(t);
+		!t || !qs(t) || !this.rowPool.get() || this.applyLoadMoreRowLayout(t);
 	}
-	syncLoadMoreRowLayout(e) {
+	applyLoadMoreRowLayout(e) {
 		let t = this.rowPool.get();
-		t && (t.syncRowLayout(e), t.syncViewportWidth(this.resolveLoadMoreViewportWidth()), t.setRowTop(this.compressedScroll ? e.rowTop - this.scrollTop : e.rowTop));
+		if (!t) return;
+		t.syncRowLayout(e);
+		let n = this.compressedScroll ? e.rowTop - this.scrollTop : e.rowTop;
+		t.setRowTop(n);
 	}
 	invalidate() {
 		this.clear();
@@ -12555,10 +12553,7 @@ var Ob = class {
 	updateLoadMoreRow(e) {
 		let t = this.getApi?.();
 		if (!t || !this.onLoadMore) return;
-		let n = this.rowPool.acquire(() => new Ob(this.container, {
-			frameService: this.frameService ?? void 0,
-			onUnmountRenderer: this.onUnmountRenderer
-		})), r = {
+		let n = this.rowPool.acquire(() => new Ob(this.container, { onUnmountRenderer: this.onUnmountRenderer })), r = {
 			loading: this.getLoadMoreRowLoading?.() ?? !1,
 			hasMore: this.getLoadMoreRowHasMore?.() ?? !0,
 			size: this.getLoadMoreRowGridSize?.() ?? "default",
@@ -12566,13 +12561,7 @@ var Ob = class {
 			onLoadMore: this.invokeLoadMore,
 			api: t
 		};
-		n.setData(e, r, this.getLoadMoreRowRenderer?.()), this.syncLoadMoreRowLayout(e);
-	}
-	resolveLoadMoreViewportWidth() {
-		let e = this.getViewportClientWidth?.() ?? 0;
-		if (e > 0) return e;
-		let t = this.container.clientWidth;
-		return t > 0 ? t : this.columnModel.getTotalWidth();
+		n.setData(e, r, this.getLoadMoreRowRenderer?.()), this.applyLoadMoreRowLayout(e);
 	}
 	clear() {
 		this.rowPool.clear();
@@ -12698,8 +12687,6 @@ var Ob = class {
 		}) : null, this.loadMoreRowRenderer = t.fullWidthRowsContainerEl ? new Ab({
 			container: t.fullWidthRowsContainerEl,
 			rowModel: this.rowModel,
-			columnModel: this.columnModel,
-			frameService: this.frameService ?? void 0,
 			onUnmountRenderer: this.onUnmountRenderer,
 			getLoadMoreRowEnabled: t.getLoadMoreRowEnabled,
 			getLoadMoreRowRenderer: t.getLoadMoreRowRenderer,
@@ -12708,8 +12695,7 @@ var Ob = class {
 			getLoadMoreRowGridSize: t.getLoadMoreRowGridSize,
 			getLoadMoreRowLabels: t.getLoadMoreRowLabels,
 			onLoadMore: t.onLoadMore,
-			getApi: t.getApi,
-			getViewportClientWidth: t.getViewportClientWidth
+			getApi: t.getApi
 		}) : null;
 	}
 	setEmbedFullWidthRows(e) {
@@ -23028,7 +23014,9 @@ var FO = class {
 	redrawViewport(e, t) {
 		let n = this.getViewportHeight();
 		this.syncCompressedLayerHeight(n);
-		let r = e ?? this.getLogicalScrollTop(), i = t ?? this.deps.viewportEl.scrollLeft, a = this.deps.viewportEl.clientWidth, o = eD(this.deps.columnModel, i, a);
+		let r = e ?? this.getLogicalScrollTop(), i = t ?? this.deps.viewportEl.scrollLeft, a = this.deps.viewportEl.clientWidth;
+		this.syncViewportInlineSize(a);
+		let o = eD(this.deps.columnModel, i, a);
 		o !== i && (this.deps.viewportEl.scrollLeft = o, this.lastScrollLeft = o, this.deps.headerScrollEl.scrollLeft = o, this.syncFooterScrollLeft(), this.syncFloatingFilterScrollLeft());
 		let s = this.getRenderViewportHeightInternal(), c = this.deps.columnViewport.update(o, a), l = this.deps.columnViewport.getWindow();
 		c && (this.reorderHeaderCells(!0), this.isColumnMoveLiveDragging() ? this.syncColumnCellLayouts() : (this.deps.refreshFooter?.(), this.deps.refreshFloatingFilter?.()), this.deps.applyFocusVisuals()), this.syncFooterScrollLeft(), this.syncFloatingFilterScrollLeft(), this.syncPinnedRows(), this.deps.ensureInfiniteRowsLoaded?.(r, s), this.deps.rowRenderer.redraw(r, s, l, c), this.deps.applyCellRangeVisuals?.(), this.syncIndexColumnFill(), this.onAfterRedraw?.();
@@ -23163,6 +23151,9 @@ var FO = class {
 	syncCompressedLayerHeight(e) {
 		this.getScrollRange(e).compressed && (this.deps.rowsLayerEl.style.height = `${e}px`, this.deps.viewportEl.style.setProperty("--mg-viewport-px", `${e}px`));
 	}
+	syncViewportInlineSize(e) {
+		e > 0 && this.deps.viewportEl.style.setProperty("--mg-viewport-inline-size", `${e}px`);
+	}
 	syncIndexColumnFill() {
 		let { indexColumnFillHostEl: e, indexColumnFillEl: t } = this.deps;
 		if (!this.deps.showIndexColumn) {
@@ -25899,8 +25890,7 @@ function uA(e, t, n) {
 		onLoadMore: () => {
 			r.eventBus.emit("loadMore", {});
 		},
-		getApi: () => n.getApi(),
-		getViewportClientWidth: () => x.viewportEl.clientWidth
+		getApi: () => n.getApi()
 	}), r.selectionOps = new YO({
 		mountEl: r.mountEl,
 		rowModel: r.rowModel,