@univerjs/engine-render 1.0.3 → 1.1.0

package/lib/index.js

@@ -1,4 +1,4 @@
-import { AlignTypeH, AlignTypeV, BaselineOffset, BooleanNumber, BorderStyleTypes, BulletAlignment, COLORS, CellValueType, ColorKit, ColumnResponsiveType, ColumnSeparatorType, CustomDecorationType, CustomRangeType, DEFAULT_DOCUMENT_PARAGRAPH_LINE_SPACING, DEFAULT_EMPTY_DOCUMENT_VALUE, DEFAULT_STYLES, DashStyleType, DataStreamTreeNodeType, DataStreamTreeTokenType, Disposable, DisposableCollection, DocumentBlockRangeType, DocumentDataModel, DocumentFlavor, DocxBreakType, EventSubject, FontStyleType, GridType, HorizontalAlign, IConfigService, IContextService, IUniverInstanceService, Inject, Injector, JSON1, ListGlyphType, LocaleService, LookUp, MODERN_DOCUMENT_DEFAULT_MARGIN, MODERN_DOCUMENT_WIDTH, MOVE_BUFFER_VALUE, ModernDocumentWidthMode, NAMED_STYLE_MAP, NAMED_STYLE_SPACE_MAP, NumberUnitType, ObjectMatrix, ObjectRelativeFromH, ObjectRelativeFromV, PRESET_LIST_TYPE, PageOrientType, Plugin, PositionedObjectLayoutType, Range, Rectangle, Registry, SectionType, SheetSkeleton, Skeleton, SpacingRule, TabStopAlignment, TableAlignmentType, TableRowHeightRule, TableSizeType, TableTextWrapType, TextDecoration, TextX, TextXActionType, ThemeService, Tools, UniverInstanceType, VerticalAlign, VerticalAlignmentType, WrapStrategy, WrapTextType, characterSpacingControlType, checkParagraphHasIndentByStyle, createIdentifier, deleteContent, getColorStyle, getDisplayValueFromCell, getRichTextEditPath, horizontalLineSegmentsSubtraction, insertTextToContent, invertColorByMatrix, isCellCoverable, isClassDependencyItem, isDefaultFormat, isNullCell, isWhiteColor, merge, noop, numberToABC, numberToListABC, numfmt, regexp, registerDependencies, remove, requestImmediateMacroTask, resolveDocumentParagraphStyle, resolveSectionHeaderFooterReferences, searchArray, sortRules, sortRulesByDesc, toDisposable } from "@univerjs/core";
+import { AlignTypeH, AlignTypeV, BaselineOffset, BooleanNumber, BorderStyleTypes, BulletAlignment, COLORS, CellValueType, ColorKit, ColumnResponsiveType, ColumnSeparatorType, CustomDecorationType, CustomRangeType, DEFAULT_DOCUMENT_PARAGRAPH_LINE_SPACING, DEFAULT_EMPTY_DOCUMENT_VALUE, DEFAULT_STYLES, DashStyleType, DataStreamTreeNodeType, DataStreamTreeTokenType, Disposable, DisposableCollection, DocumentBlockRangeType, DocumentDataModel, DocumentFlavor, DocxBreakType, EventSubject, FontStyleType, GridType, HorizontalAlign, IConfigService, IContextService, IUniverInstanceService, Inject, Injector, JSON1, ListGlyphType, LocaleService, LookUp, MODERN_DOCUMENT_DEFAULT_MARGIN, MODERN_DOCUMENT_WIDTH, MOVE_BUFFER_VALUE, ModernDocumentWidthMode, NAMED_STYLE_MAP, NAMED_STYLE_SPACE_MAP, NumberUnitType, ObjectMatrix, ObjectRelativeFromH, ObjectRelativeFromV, PRESET_LIST_TYPE, PageOrientType, Plugin, PositionedObjectLayoutType, Range, Rectangle, Registry, SHEET_TEXT_LINE_GAP, SectionType, SheetSkeleton, Skeleton, SpacingRule, TabStopAlignment, TableAlignmentType, TableRowHeightRule, TableSizeType, TableTextWrapType, TextDecoration, TextX, TextXActionType, ThemeService, Tools, UniverInstanceType, VerticalAlign, VerticalAlignmentType, WrapStrategy, WrapTextType, characterSpacingControlType, checkParagraphHasIndentByStyle, createIdentifier, deleteContent, getColorStyle, getDisplayValueFromCell, getRichTextEditPath, horizontalLineSegmentsSubtraction, insertTextToContent, invertColorByMatrix, isCellCoverable, isClassDependencyItem, isDefaultFormat, isNullCell, isWhiteColor, merge, noop, numberToABC, numberToListABC, numfmt, regexp, registerDependencies, remove, requestImmediateMacroTask, resolveDocumentParagraphStyle, resolveSectionHeaderFooterReferences, searchArray, sortRules, sortRulesByDesc, toDisposable } from "@univerjs/core";
 import { BehaviorSubject, Observable, Subject, Subscription, distinctUntilChanged, merge as merge$1, shareReplay, startWith } from "rxjs";
 import { franc } from "franc-min";
 import { getOverflowAncestors } from "@floating-ui/dom";
@@ -22,7 +22,7 @@ var __exportAll = (all, no_symbols) => {
 };
 
 //#endregion
-//#region \0@oxc-project+runtime@0.149.0/helpers/esm/typeof.js
+//#region \0@oxc-project+runtime@0.153.0/helpers/esm/typeof.js
 function _typeof(o) {
 	"@babel/helpers - typeof";
 	return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) {
@@ -33,7 +33,7 @@ function _typeof(o) {
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.149.0/helpers/esm/toPrimitive.js
+//#region \0@oxc-project+runtime@0.153.0/helpers/esm/toPrimitive.js
 function toPrimitive(t, r) {
 	if ("object" != _typeof(t) || !t) return t;
 	var e = t[Symbol.toPrimitive];
@@ -46,14 +46,14 @@ function toPrimitive(t, r) {
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.149.0/helpers/esm/toPropertyKey.js
+//#region \0@oxc-project+runtime@0.153.0/helpers/esm/toPropertyKey.js
 function toPropertyKey(t) {
 	var i = toPrimitive(t, "string");
 	return "symbol" == _typeof(i) ? i : i + "";
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.149.0/helpers/esm/defineProperty.js
+//#region \0@oxc-project+runtime@0.153.0/helpers/esm/defineProperty.js
 function _defineProperty(e, r, t) {
 	return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
 		value: t,
@@ -5695,7 +5695,7 @@ var Border = class extends SheetExtension {
 			let startX = cellStartX;
 			let endX = cellEndX;
 			if (type !== "t" && type !== "b" && type !== "l" && type !== "r") {
-				if (isMerged) return true;
+				if (isMerged) continue;
 				if (isMergedMainCell) {
 					startY = mergeInfo.startY;
 					endY = mergeInfo.endY;
@@ -11919,12 +11919,13 @@ var LineBreaker = class {
 * limitations under the License.
 */
 var DocSimpleSkeleton = class {
-	constructor(_text, _fontStyle, _warp, _width, _height) {
+	constructor(_text, _fontStyle, _warp, _width, _height, _lineGap = 0) {
 		this._text = _text;
 		this._fontStyle = _fontStyle;
 		this._warp = _warp;
 		this._width = _width;
 		this._height = _height;
+		this._lineGap = _lineGap;
 		_defineProperty(this, "_lineBreaker", void 0);
 		_defineProperty(this, "_lines", []);
 		_defineProperty(this, "_dirty", true);
@@ -11976,7 +11977,7 @@ var DocSimpleSkeleton = class {
 					if (textSize.width > this._width) {
 						if (currentLine.text.length > 0) {
 							this._lines.push(currentLine);
-							totalHeight += currentLine.height;
+							totalHeight += currentLine.height + (this._lines.length > 1 ? this._lineGap : 0);
 							if (totalHeight > this._height) break;
 							currentLine = {
 								text: "",
@@ -12032,7 +12033,7 @@ var DocSimpleSkeleton = class {
 								remainingText = remainingText.slice(charCount);
 								if (remainingText.length > 0) {
 									this._lines.push(currentLine);
-									totalHeight += currentLine.height;
+									totalHeight += currentLine.height + (this._lines.length > 1 ? this._lineGap : 0);
 									if (totalHeight > this._height) break;
 									currentLine = {
 										text: "",
@@ -12045,7 +12046,7 @@ var DocSimpleSkeleton = class {
 						}
 					} else if (currentLine.text.length > 0) {
 						this._lines.push(currentLine);
-						totalHeight += currentLine.height;
+						totalHeight += currentLine.height + (this._lines.length > 1 ? this._lineGap : 0);
 						if (totalHeight > this._height) break;
 						currentLine = {
 							text,
@@ -12068,7 +12069,7 @@ var DocSimpleSkeleton = class {
 			}
 			if (isMandatoryBreak) {
 				this._lines.push(currentLine);
-				totalHeight += currentLine.height;
+				totalHeight += currentLine.height + (this._lines.length > 1 ? this._lineGap : 0);
 				if (totalHeight > this._height) break;
 				currentLine = {
 					text: "",
@@ -12086,7 +12087,7 @@ var DocSimpleSkeleton = class {
 		return this._lines;
 	}
 	getTotalHeight() {
-		return this._lines.reduce((acc, line) => acc + line.height, 0);
+		return this._lines.reduce((acc, line) => acc + line.height, 0) + Math.max(0, this._lines.length - 1) * this._lineGap;
 	}
 	getTotalWidth() {
 		return this._lines.reduce((acc, line) => Math.max(acc, line.width), 0);
@@ -12440,6 +12441,7 @@ const TEXT_OBJECT_ARRAY = [
 	"text",
 	"fontStyle",
 	"warp",
+	"lineGap",
 	"hAlign",
 	"vAlign",
 	"width",
@@ -12452,6 +12454,7 @@ var Text = class Text extends Shape {
 		_defineProperty(this, "text", void 0);
 		_defineProperty(this, "fontStyle", void 0);
 		_defineProperty(this, "warp", void 0);
+		_defineProperty(this, "lineGap", void 0);
 		_defineProperty(this, "hAlign", void 0);
 		_defineProperty(this, "vAlign", void 0);
 		_defineProperty(this, "skeleton", void 0);
@@ -12460,14 +12463,15 @@ var Text = class Text extends Shape {
 		this.text = props.text;
 		this.fontStyle = props.fontStyle;
 		this.warp = props.warp ?? false;
+		this.lineGap = props.lineGap ?? 0;
 		this.hAlign = props.hAlign ?? HorizontalAlign.LEFT;
 		this.vAlign = props.vAlign ?? VerticalAlign.TOP;
-		this.skeleton = new DocSimpleSkeleton(props.text, props.fontStyle, Boolean(props.warp), props.width, props.height);
+		this.skeleton = new DocSimpleSkeleton(props.text, props.fontStyle, Boolean(props.warp), props.width, props.height, this.lineGap);
 	}
 	static drawWith(ctx, props, _skeleton) {
-		const { text, fontStyle, warp, hAlign, vAlign, width, height, left = 0, top = 0, cellValueType } = props;
+		const { text, fontStyle, warp, lineGap = 0, hAlign, vAlign, width, height, left = 0, top = 0, cellValueType } = props;
 		const cachedLayout = !_skeleton && !warp ? Text._getCachedLayout(text, fontStyle) : null;
-		const skeleton = cachedLayout ? null : _skeleton ?? new DocSimpleSkeleton(text, fontStyle, Boolean(warp), width, vAlign === VerticalAlign.TOP ? height : Infinity);
+		const skeleton = cachedLayout ? null : _skeleton ?? new DocSimpleSkeleton(text, fontStyle, Boolean(warp), width, vAlign === VerticalAlign.TOP ? height : Infinity, lineGap);
 		const lines = (cachedLayout === null || cachedLayout === void 0 ? void 0 : cachedLayout.lines) ?? skeleton.calculate();
 		const totalHeight = (cachedLayout === null || cachedLayout === void 0 ? void 0 : cachedLayout.totalHeight) ?? skeleton.getTotalHeight();
 		let lineTop = top + (vAlign === VerticalAlign.TOP ? 0 : vAlign === VerticalAlign.MIDDLE ? (height - totalHeight) / 2 : height - totalHeight);
@@ -12512,7 +12516,7 @@ var Text = class Text extends Shape {
 				lineWidth: 1,
 				lineType: TextDecoration.SINGLE
 			});
-			lineTop = lineTop + lineHeight;
+			lineTop = lineTop + lineHeight + lineGap;
 		}
 		ctx.restore();
 		return totalHeight;
@@ -13911,6 +13915,26 @@ var DocumentViewModel = class DocumentViewModel {
 	}
 };
 
+//#endregion
+//#region src/components/docs/layout/header-footer-field.ts
+function resolveHeaderFooterFieldGlyph(glyph, startIndex, endIndex, customRanges, pageNumber, pageCount) {
+	var _fieldRange$propertie, _fieldRange$propertie2;
+	if (!glyph.content || glyph.raw === DataStreamTreeTokenType.CUSTOM_RANGE_START || glyph.raw === DataStreamTreeTokenType.CUSTOM_RANGE_END) return glyph;
+	const fieldRange = customRanges.find((customRange) => {
+		var _customRange$properti;
+		return customRange.rangeType === CustomRangeType.FIELD && customRange.startIndex <= startIndex && customRange.endIndex >= endIndex && typeof ((_customRange$properti = customRange.properties) === null || _customRange$properti === void 0 ? void 0 : _customRange$properti.fieldType) === "string";
+	});
+	const fieldType = fieldRange === null || fieldRange === void 0 || (_fieldRange$propertie = fieldRange.properties) === null || _fieldRange$propertie === void 0 || (_fieldRange$propertie = _fieldRange$propertie.fieldType) === null || _fieldRange$propertie === void 0 ? void 0 : _fieldRange$propertie.toUpperCase();
+	if (!fieldRange || ((_fieldRange$propertie2 = fieldRange.properties) === null || _fieldRange$propertie2 === void 0 ? void 0 : _fieldRange$propertie2.locked) === BooleanNumber.TRUE || fieldType !== "PAGE" && fieldType !== "NUMPAGES") return glyph;
+	if (fieldType === "NUMPAGES" && pageCount == null) return glyph;
+	let content = "";
+	if (startIndex === fieldRange.startIndex + 1) content = String(fieldType === "PAGE" ? pageNumber : pageCount);
+	return content === glyph.content ? glyph : {
+		...glyph,
+		content
+	};
+}
+
 //#endregion
 //#region src/components/docs/layout/line-breaker/enhancers/utils.ts
 /**
@@ -16957,7 +16981,7 @@ function dealWithSection(ctx, viewModel, sectionNode, curPage, sectionBreakConfi
 		if (ctx.isDirty) break;
 	}
 	const { segmentId } = curPage;
-	if (ctx.isDirty && ctx.layoutStartPointer[segmentId] != null) _rollbackPages(ctx.layoutStartPointer[segmentId], allCurrentSkeletonPages);
+	if (ctx.isDirty && ctx.layoutStartPointer[segmentId] != null) rollbackSectionPages(ctx.layoutStartPointer[segmentId], allCurrentSkeletonPages);
 	return {
 		pages: allCurrentSkeletonPages,
 		renderedBlockIdMap,
@@ -16965,7 +16989,7 @@ function dealWithSection(ctx, viewModel, sectionNode, curPage, sectionBreakConfi
 		complete: paragraphEndIndex >= sectionNode.children.length
 	};
 }
-function _rollbackPages(paragraphIndex, allCurrentSkeletonPages) {
+function rollbackSectionPages(paragraphIndex, allCurrentSkeletonPages) {
 	let findFirstDirtyLine = false;
 	for (let pageIndex = 0; pageIndex < allCurrentSkeletonPages.length; pageIndex++) {
 		const page = allCurrentSkeletonPages[pageIndex];
@@ -17049,27 +17073,75 @@ function createSkeletonPage(ctx, sectionBreakConfig, skeletonResourceReference,
 	let header;
 	let footer;
 	if (headerId) {
-		var _skeHeaders$get;
-		if ((_skeHeaders$get = skeHeaders.get(headerId)) === null || _skeHeaders$get === void 0 ? void 0 : _skeHeaders$get.has(pageWidth)) {
+		var _headerTreeMap$get, _skeHeaders$get;
+		const fieldRanges = headerTreeMap === null || headerTreeMap === void 0 || (_headerTreeMap$get = headerTreeMap.get(headerId)) === null || _headerTreeMap$get === void 0 || (_headerTreeMap$get = _headerTreeMap$get.getBody()) === null || _headerTreeMap$get === void 0 ? void 0 : _headerTreeMap$get.customRanges;
+		const dynamic = fieldRanges === null || fieldRanges === void 0 ? void 0 : fieldRanges.some((range) => {
+			var _range$properties, _range$properties2, _range$properties3;
+			return range.rangeType === CustomRangeType.FIELD && ((_range$properties = range.properties) === null || _range$properties === void 0 ? void 0 : _range$properties.locked) !== BooleanNumber.TRUE && (((_range$properties2 = range.properties) === null || _range$properties2 === void 0 ? void 0 : _range$properties2.fieldType) === "PAGE" || ((_range$properties3 = range.properties) === null || _range$properties3 === void 0 ? void 0 : _range$properties3.fieldType) === "NUMPAGES");
+		});
+		const key = dynamic ? JSON.stringify([
+			sectionId,
+			pageNumber,
+			pageWidth,
+			marginLeft,
+			marginRight,
+			ctx.hasNumPagesFields ? ctx.fieldPageCount : void 0
+		]) : pageWidth;
+		if (typeof key === "string") page.headerLayoutKey = key;
+		if ((_skeHeaders$get = skeHeaders.get(headerId)) === null || _skeHeaders$get === void 0 ? void 0 : _skeHeaders$get.has(key)) {
 			var _skeHeaders$get2;
-			header = (_skeHeaders$get2 = skeHeaders.get(headerId)) === null || _skeHeaders$get2 === void 0 ? void 0 : _skeHeaders$get2.get(pageWidth);
+			header = (_skeHeaders$get2 = skeHeaders.get(headerId)) === null || _skeHeaders$get2 === void 0 ? void 0 : _skeHeaders$get2.get(key);
 		} else if (headerTreeMap && headerTreeMap.has(headerId)) {
-			header = _createSkeletonHeaderFooter(ctx, headerTreeMap.get(headerId), sectionBreakConfig, skeletonResourceReference, headerId, true);
+			const previousFieldContext = ctx.headerFooterFieldContext;
+			ctx.headerFooterFieldContext = dynamic ? {
+				pageNumber,
+				pageCount: ctx.fieldPageCount
+			} : void 0;
+			try {
+				header = _createSkeletonHeaderFooter(ctx, headerTreeMap.get(headerId), sectionBreakConfig, skeletonResourceReference, headerId, true);
+				header.fieldsResolved = Boolean(dynamic);
+			} finally {
+				ctx.headerFooterFieldContext = previousFieldContext;
+			}
 			const widths = skeHeaders.get(headerId) ?? /* @__PURE__ */ new Map();
-			widths.set(pageWidth, header);
+			widths.set(key, header);
 			skeHeaders.set(headerId, widths);
 		}
 		page.headerId = headerId;
 	}
 	if (footerId) {
-		var _skeFooters$get;
-		if ((_skeFooters$get = skeFooters.get(footerId)) === null || _skeFooters$get === void 0 ? void 0 : _skeFooters$get.has(pageWidth)) {
+		var _footerTreeMap$get, _skeFooters$get;
+		const fieldRanges = footerTreeMap === null || footerTreeMap === void 0 || (_footerTreeMap$get = footerTreeMap.get(footerId)) === null || _footerTreeMap$get === void 0 || (_footerTreeMap$get = _footerTreeMap$get.getBody()) === null || _footerTreeMap$get === void 0 ? void 0 : _footerTreeMap$get.customRanges;
+		const dynamic = fieldRanges === null || fieldRanges === void 0 ? void 0 : fieldRanges.some((range) => {
+			var _range$properties4, _range$properties5, _range$properties6;
+			return range.rangeType === CustomRangeType.FIELD && ((_range$properties4 = range.properties) === null || _range$properties4 === void 0 ? void 0 : _range$properties4.locked) !== BooleanNumber.TRUE && (((_range$properties5 = range.properties) === null || _range$properties5 === void 0 ? void 0 : _range$properties5.fieldType) === "PAGE" || ((_range$properties6 = range.properties) === null || _range$properties6 === void 0 ? void 0 : _range$properties6.fieldType) === "NUMPAGES");
+		});
+		const key = dynamic ? JSON.stringify([
+			sectionId,
+			pageNumber,
+			pageWidth,
+			marginLeft,
+			marginRight,
+			ctx.hasNumPagesFields ? ctx.fieldPageCount : void 0
+		]) : pageWidth;
+		if (typeof key === "string") page.footerLayoutKey = key;
+		if ((_skeFooters$get = skeFooters.get(footerId)) === null || _skeFooters$get === void 0 ? void 0 : _skeFooters$get.has(key)) {
 			var _skeFooters$get2;
-			footer = (_skeFooters$get2 = skeFooters.get(footerId)) === null || _skeFooters$get2 === void 0 ? void 0 : _skeFooters$get2.get(pageWidth);
+			footer = (_skeFooters$get2 = skeFooters.get(footerId)) === null || _skeFooters$get2 === void 0 ? void 0 : _skeFooters$get2.get(key);
 		} else if (footerTreeMap && footerTreeMap.has(footerId)) {
-			footer = _createSkeletonHeaderFooter(ctx, footerTreeMap.get(footerId), sectionBreakConfig, skeletonResourceReference, footerId, false);
+			const previousFieldContext = ctx.headerFooterFieldContext;
+			ctx.headerFooterFieldContext = dynamic ? {
+				pageNumber,
+				pageCount: ctx.fieldPageCount
+			} : void 0;
+			try {
+				footer = _createSkeletonHeaderFooter(ctx, footerTreeMap.get(footerId), sectionBreakConfig, skeletonResourceReference, footerId, false);
+				footer.fieldsResolved = Boolean(dynamic);
+			} finally {
+				ctx.headerFooterFieldContext = previousFieldContext;
+			}
 			const widths = skeFooters.get(footerId) ?? /* @__PURE__ */ new Map();
-			widths.set(pageWidth, footer);
+			widths.set(key, footer);
 			skeFooters.set(footerId, widths);
 		}
 		page.footerId = footerId;
@@ -17078,6 +17150,29 @@ function createSkeletonPage(ctx, sectionBreakConfig, skeletonResourceReference,
 	page.originMarginBottom = marginBottom;
 	page.marginTop = _getVerticalMargin(marginTop, header);
 	page.marginBottom = _getVerticalMargin(marginBottom, footer);
+	if (ctx.headerFooterMinimumMargins) for (const [id, layoutKey, margin] of [[
+		headerId,
+		page.headerLayoutKey,
+		"marginTop"
+	], [
+		footerId,
+		page.footerLayoutKey,
+		"marginBottom"
+	]]) {
+		if (layoutKey == null) continue;
+		const key = JSON.stringify([
+			id,
+			sectionId,
+			pageNumber,
+			pageWidth,
+			marginLeft,
+			marginRight,
+			margin
+		]);
+		const maximum = Math.max(page[margin], ctx.headerFooterMinimumMargins.get(key) ?? 0);
+		ctx.headerFooterMinimumMargins.set(key, maximum);
+		if (ctx.fieldCountCycle) page[margin] = maximum;
+	}
 	const sections = page.sections;
 	const lastSection = sections[sections.length - 1];
 	const { marginTop: curPageMT, marginBottom: curPageMB, marginLeft: curPageML, marginRight: curPageMR } = page;
@@ -17394,8 +17489,13 @@ function resetCellDrawingAnchors(ctx, cellNode, tableId) {
 	if (!anchors) return;
 	for (const paragraph of cellNode.children[0].children) anchors.delete(paragraph.endIndex);
 }
-function createSkeletonCellPages(ctx, viewModel, cellNode, sectionBreakConfig, tableConfig, row, col, availableHeight = Number.POSITIVE_INFINITY, maxCellPageHeight = Number.POSITIVE_INFINITY, cellPageHeights) {
+function createSkeletonCellPages(parentContext, viewModel, cellNode, sectionBreakConfig, tableConfig, row, col, availableHeight = Number.POSITIVE_INFINITY, maxCellPageHeight = Number.POSITIVE_INFINITY, cellPageHeights) {
 	var _ctx$dataModel, _ctx$dataModel$getBod;
+	const ctx = {
+		...parentContext,
+		isDirty: false,
+		layoutStartPointer: { ...parentContext.layoutStartPointer }
+	};
 	const sectionNode = cellNode.children[0];
 	const body = (_ctx$dataModel = ctx.dataModel) === null || _ctx$dataModel === void 0 || (_ctx$dataModel$getBod = _ctx$dataModel.getBody) === null || _ctx$dataModel$getBod === void 0 ? void 0 : _ctx$dataModel$getBod.call(_ctx$dataModel);
 	const { enableDocumentTableLineGrid, inheritDocumentLinePitch } = getCellLineGridOptions(sectionBreakConfig);
@@ -17434,7 +17534,12 @@ function createSkeletonCellPages(ctx, viewModel, cellNode, sectionBreakConfig, t
 	finishVerticalCellLayout(pages, verticalCellWidth);
 	return pages;
 }
-function startSkeletonCellPagesBuild(ctx, viewModel, cellNode, sectionBreakConfig, tableConfig, row, col, availableHeight = Number.POSITIVE_INFINITY, maxCellPageHeight = Number.POSITIVE_INFINITY, cellPageHeights) {
+function startSkeletonCellPagesBuild(parentContext, viewModel, cellNode, sectionBreakConfig, tableConfig, row, col, availableHeight = Number.POSITIVE_INFINITY, maxCellPageHeight = Number.POSITIVE_INFINITY, cellPageHeights) {
+	const ctx = {
+		...parentContext,
+		isDirty: false,
+		layoutStartPointer: { ...parentContext.layoutStartPointer }
+	};
 	const sectionNode = cellNode.children[0];
 	const { enableDocumentTableLineGrid, inheritDocumentLinePitch } = getCellLineGridOptions(sectionBreakConfig);
 	const { page, sectionBreakConfig: cellSectionBreakConfig, verticalCellWidth } = createNullCellPage(ctx, sectionBreakConfig, tableConfig, row, col, availableHeight, maxCellPageHeight, inheritDocumentLinePitch, enableDocumentTableLineGrid, cellPageHeights);
@@ -18140,6 +18245,7 @@ function _getParagraphLineMetrics(ctx, glyphGroup, lastPage, column, sectionBrea
 		marginTop: 0,
 		spaceBelowApply: (preLine === null || preLine === void 0 ? void 0 : preLine.spaceBelowApply) ?? 0
 	} : __getParagraphSpace(((_sectionBreakConfig$d2 = sectionBreakConfig.documentCompatibilityPolicy) === null || _sectionBreakConfig$d2 === void 0 ? void 0 : _sectionBreakConfig$d2.mode) === "drawingml", lineSpacingApply, suppressCellAutoSpaceAbove ? void 0 : spaceAbove, spaceBelow, isParagraphFirstShapedText, preLine, _shouldSuppressPageTopSpacing(lastPage, column, paragraphConfig, preLine, firstPageNumber, startingSection != null), drawingMLLineHeight);
+	if (preLine) marginTop += sectionBreakConfig.lineGap ?? 0;
 	if (startingSection && marginTop > 0 && isTraditionalDocumentCompatibility(paragraphConfig.documentCompatibilityPolicy)) marginTop = _collapseSectionBeforeSpacing(ctx, startingSection.children[0].startIndex - 2, marginTop);
 	if (positionedCustomBlockOnly) spaceBelowApply = 0;
 	const isHiddenCellEndMark = lastPage.type === 3 && isTraditionalDocumentCompatibility(paragraphConfig.documentCompatibilityPolicy) && sectionBreakConfig.cellHiddenEndMarkIndex === paragraphIndex && paragraphConfig.bulletSkeleton == null && glyphGroup.length > 0 && glyphGroup.every(__isStructuralTerminatorGlyph);
@@ -18277,8 +18383,8 @@ function _lineOperator(ctx, glyphGroup, pages, sectionBreakConfig, paragraphConf
 	const initialFootnoteTop = lastPage.type === 4 && lastPage.pageNumber === 1 && columnInfo.index === ((_ctx$footnoteFirstCol = ctx.footnoteFirstColumn) === null || _ctx$footnoteFirstCol === void 0 ? void 0 : _ctx$footnoteFirstCol.index) ? ctx.footnoteFirstColumn.top : 0;
 	const lineTop = preLineHeight + ((preLine === null || preLine === void 0 ? void 0 : preLine.top) ?? initialFootnoteTop);
 	const { pageWidth, headerId, footerId } = lastPage;
-	const headerPage = skeHeaders === null || skeHeaders === void 0 || (_skeHeaders$get = skeHeaders.get(headerId)) === null || _skeHeaders$get === void 0 ? void 0 : _skeHeaders$get.get(pageWidth);
-	const footerPage = skeFooters === null || skeFooters === void 0 || (_skeFooters$get = skeFooters.get(footerId)) === null || _skeFooters$get === void 0 ? void 0 : _skeFooters$get.get(pageWidth);
+	const headerPage = skeHeaders === null || skeHeaders === void 0 || (_skeHeaders$get = skeHeaders.get(headerId)) === null || _skeHeaders$get === void 0 ? void 0 : _skeHeaders$get.get(lastPage.headerLayoutKey ?? pageWidth);
+	const footerPage = skeFooters === null || skeFooters === void 0 || (_skeFooters$get = skeFooters.get(footerId)) === null || _skeFooters$get === void 0 ? void 0 : _skeFooters$get.get(lastPage.footerLayoutKey ?? pageWidth);
 	let needOpenNewPageByTableLayout = false;
 	const { deferredInlineGroupAnchorDrawings, deferredTopBottomAnchorDrawings } = _positionLineDrawings(ctx, glyphGroup, column, lastPage, paragraphConfig, lineTop, lineHeight, paragraphAnchorLeft, hasInlineCustomBlock, isParagraphFirstShapedText);
 	if (skeTablesInParagraph != null && skeTablesInParagraph.length > 0) {
@@ -18339,7 +18445,11 @@ function _lineOperator(ctx, glyphGroup, pages, sectionBreakConfig, paragraphConf
 	if (borderTopSpace > 0) newLine.borderTopSpace = borderTopSpace;
 	if (borderBottomSpace > 0) newLine.borderBottomSpace = borderBottomSpace;
 	const blockAnchorTop = deferredTopBottomAnchorDrawings.length > 0 ? newLineTop : lineTop;
-	if (!isStandalonePageBoundary) createAndUpdateBlockAnchor(paragraphIndex, newLine, blockAnchorTop, pDrawingAnchor);
+	if (!isStandalonePageBoundary) {
+		createAndUpdateBlockAnchor(paragraphIndex, newLine, blockAnchorTop, pDrawingAnchor);
+		const paragraphDrawingAnchor = pDrawingAnchor === null || pDrawingAnchor === void 0 ? void 0 : pDrawingAnchor.get(paragraphIndex);
+		if (paragraphDrawingAnchor) paragraphDrawingAnchor.left = paragraphAnchorLeft;
+	}
 	if (deferredTopBottomAnchorDrawings.length > 0) {
 		__updateAndPositionDrawings(ctx, newLineTop, lineHeight, column, deferredTopBottomAnchorDrawings, paragraphConfig.paragraphIndex, isParagraphFirstShapedText, blockAnchorTop, paragraphAnchorLeft, false, true);
 		__updateTopBottomCustomBlockFlowBottom(paragraphConfig, deferredTopBottomAnchorDrawings, section.top);
@@ -18354,6 +18464,10 @@ function __updateAndPositionDrawings(ctx, lineTop, lineHeight, column, targetDra
 	if (targetDrawings.length === 0) return;
 	const drawings = __getDrawingPosition(ctx, lineTop, lineHeight, column, isParagraphFirstShapedText, drawingAnchorTop, targetDrawings, drawingAnchorLeft);
 	if (drawings == null || drawings.size === 0) return;
+	for (const drawing of drawings.values()) if (drawing.drawingOrigin.docTransform.positionV.relativeFrom === ObjectRelativeFromV.LINE) {
+		var _ctx$skeletonResource;
+		drawing.blockAnchorLeft = ((_ctx$skeletonResource = ctx.skeletonResourceReference) === null || _ctx$skeletonResource === void 0 || (_ctx$skeletonResource = _ctx$skeletonResource.drawingAnchor) === null || _ctx$skeletonResource === void 0 || (_ctx$skeletonResource = _ctx$skeletonResource.get(column.parent.parent.segmentId)) === null || _ctx$skeletonResource === void 0 || (_ctx$skeletonResource = _ctx$skeletonResource.get(paragraphIndex)) === null || _ctx$skeletonResource === void 0 ? void 0 : _ctx$skeletonResource.left) ?? drawing.blockAnchorLeft;
+	}
 	const floatObjects = [...drawings.values()].filter((drawing) => {
 		const layoutType = drawing.drawingOrigin.layoutType;
 		return layoutType !== PositionedObjectLayoutType.INLINE && layoutType !== PositionedObjectLayoutType.WRAP_NONE;
@@ -18826,7 +18940,7 @@ function getLineHeightMetrics(glyphLineHeight, paragraphLineGapDefault, linePitc
 		lineSpacingApply: exactLineSpacingApply
 	};
 }
-function updateInlineDrawingPosition(line, paragraphInlineSkeDrawings, unitId = "", blockAnchorTop, paragraphNonInlineSkeDrawings, documentCompatibilityPolicy) {
+function updateInlineDrawingPosition(line, paragraphInlineSkeDrawings, unitId = "", blockAnchorTop, paragraphNonInlineSkeDrawings, documentCompatibilityPolicy, blockAnchorLeft = 0, normalizeTraditionalColumnAnchor = false) {
 	var _line$parent;
 	const column = line.parent;
 	const section = column === null || column === void 0 ? void 0 : column.parent;
@@ -18892,6 +19006,9 @@ function updateInlineDrawingPosition(line, paragraphInlineSkeDrawings, unitId =
 		drawing.lineTop = lineTop;
 		drawing.columnLeft = column.left;
 		drawing.blockAnchorTop = blockAnchorTop == null ? lineTop : sectionTop + blockAnchorTop;
+		drawing.blockAnchorLeft = blockAnchorLeft;
+		drawing.normalizeTraditionalColumnAnchor = normalizeTraditionalColumnAnchor;
+		drawing.pageAnchorLeft = normalizeTraditionalColumnAnchor ? page.marginLeft : 0;
 		drawing.lineHeight = line.lineHeight;
 		drawings.set(drawing.drawingId, drawing);
 	}
@@ -18949,6 +19066,9 @@ function __getDrawingPosition(ctx, lineTop, lineHeight, column, isParagraphFirst
 		} : void 0;
 		drawing.initialState = true;
 		drawing.columnLeft = column.left;
+		drawing.blockAnchorLeft = blockAnchorLeft;
+		drawing.normalizeTraditionalColumnAnchor = normalizeTraditionalColumnAnchor && ctx.dataModel.documentStyle.documentFlavor === DocumentFlavor.TRADITIONAL;
+		drawing.pageAnchorLeft = ctx.dataModel.documentStyle.documentFlavor === DocumentFlavor.TRADITIONAL ? page.marginLeft : 0;
 		drawing.lineTop = absoluteLineTop;
 		drawing.lineHeight = lineHeight;
 		drawing.isPageBreak = isPageBreak;
@@ -19364,7 +19484,7 @@ function updateInlineDrawingCoordsAndBorder(ctx, pages) {
 		const drawingAnchor = (_ctx$skeletonResource = ctx.skeletonResourceReference) === null || _ctx$skeletonResource === void 0 || (_ctx$skeletonResource = _ctx$skeletonResource.drawingAnchor) === null || _ctx$skeletonResource === void 0 || (_ctx$skeletonResource = _ctx$skeletonResource.get(segmentId)) === null || _ctx$skeletonResource === void 0 ? void 0 : _ctx$skeletonResource.get(line.paragraphIndex);
 		if (affectInlineDrawings && affectInlineDrawings.size > 0) {
 			var _ctx$dataModel$getUni, _ctx$dataModel;
-			updateInlineDrawingPosition(line, affectInlineDrawings, ((_ctx$dataModel$getUni = (_ctx$dataModel = ctx.dataModel).getUnitId) === null || _ctx$dataModel$getUni === void 0 ? void 0 : _ctx$dataModel$getUni.call(_ctx$dataModel)) ?? "", drawingAnchor === null || drawingAnchor === void 0 ? void 0 : drawingAnchor.top, affectNonInlineDrawings, paragraphConfig === null || paragraphConfig === void 0 ? void 0 : paragraphConfig.documentCompatibilityPolicy);
+			updateInlineDrawingPosition(line, affectInlineDrawings, ((_ctx$dataModel$getUni = (_ctx$dataModel = ctx.dataModel).getUnitId) === null || _ctx$dataModel$getUni === void 0 ? void 0 : _ctx$dataModel$getUni.call(_ctx$dataModel)) ?? "", drawingAnchor === null || drawingAnchor === void 0 ? void 0 : drawingAnchor.top, affectNonInlineDrawings, paragraphConfig === null || paragraphConfig === void 0 ? void 0 : paragraphConfig.documentCompatibilityPolicy, drawingAnchor === null || drawingAnchor === void 0 ? void 0 : drawingAnchor.left, ctx.dataModel.documentStyle.documentFlavor === DocumentFlavor.TRADITIONAL);
 		}
 		const paragraphStyle = paragraphConfig === null || paragraphConfig === void 0 ? void 0 : paragraphConfig.paragraphStyle;
 		const paragraphBackgroundColor = paragraphStyle === null || paragraphStyle === void 0 || (_paragraphStyle$shadi = paragraphStyle.shading) === null || _paragraphStyle$shadi === void 0 ? void 0 : _paragraphStyle$shadi.backgroundColor;
@@ -19484,7 +19604,7 @@ function documentSkeletonTableIterator(pages, options = {}) {
 			unitId
 		});
 		const rootPageDocumentLeft = docsLeft + rootPage.marginLeft;
-		const headerPage = rootPage.headerId == null ? void 0 : skeHeaders === null || skeHeaders === void 0 || (_skeHeaders$get = skeHeaders.get(rootPage.headerId)) === null || _skeHeaders$get === void 0 ? void 0 : _skeHeaders$get.get(rootPage.pageWidth);
+		const headerPage = rootPage.headerId == null ? void 0 : skeHeaders === null || skeHeaders === void 0 || (_skeHeaders$get = skeHeaders.get(rootPage.headerId)) === null || _skeHeaders$get === void 0 ? void 0 : _skeHeaders$get.get(rootPage.headerLayoutKey ?? rootPage.pageWidth);
 		if (headerPage != null) collectPageTables({
 			contexts,
 			docsLeft,
@@ -19499,7 +19619,7 @@ function documentSkeletonTableIterator(pages, options = {}) {
 			tableCellInsetX,
 			unitId
 		});
-		const footerPage = rootPage.footerId == null ? void 0 : skeFooters === null || skeFooters === void 0 || (_skeFooters$get = skeFooters.get(rootPage.footerId)) === null || _skeFooters$get === void 0 ? void 0 : _skeFooters$get.get(rootPage.pageWidth);
+		const footerPage = rootPage.footerId == null ? void 0 : skeFooters === null || skeFooters === void 0 || (_skeFooters$get = skeFooters.get(rootPage.footerId)) === null || _skeFooters$get === void 0 ? void 0 : _skeFooters$get.get(rootPage.footerLayoutKey ?? rootPage.pageWidth);
 		if (footerPage != null) collectPageTables({
 			contexts,
 			docsLeft,
@@ -21095,6 +21215,26 @@ function shaping(ctx, content, viewModel, paragraphNode, sectionBreakConfig) {
 			for (const glyph of shapedGlyphs) if (isCjkLeftAlignedPunctuation(glyph.content) || isCjkRightAlignedPunctuation(glyph.content) || isCjkCenterAlignedPunctuation(glyph.content)) glyph.adjustability.shrinkability = [0, 0];
 		}
 		if (((_sectionBreakConfig$r5 = sectionBreakConfig.renderConfig) === null || _sectionBreakConfig$r5 === void 0 ? void 0 : _sectionBreakConfig$r5.preservePunctuationSpacing) !== BooleanNumber.TRUE && (!traditionalLayout || fixedPunctuationPairs)) punctuationSpaceAdjustment(shapedGlyphs, fixedPunctuationPairs);
+		if (ctx.headerFooterFieldContext) {
+			let index = paragraphNode.contentStartIndex + last;
+			for (let glyphIndex = 0; glyphIndex < shapedGlyphs.length; glyphIndex++) {
+				var _viewModel$getBody3, _glyph$fontStyle, _glyph$ts2;
+				const glyph = shapedGlyphs[glyphIndex];
+				const resolved = resolveHeaderFooterFieldGlyph(glyph, index, index + glyph.count - 1, ((_viewModel$getBody3 = viewModel.getBody()) === null || _viewModel$getBody3 === void 0 ? void 0 : _viewModel$getBody3.customRanges) ?? [], ctx.headerFooterFieldContext.pageNumber, ctx.headerFooterFieldContext.pageCount);
+				index += glyph.count;
+				if (resolved === glyph) continue;
+				const font = (_glyph$fontStyle = glyph.fontStyle) === null || _glyph$fontStyle === void 0 ? void 0 : _glyph$fontStyle.fontString;
+				const widthDelta = resolved.content && font ? (FontCache.getMeasureText(resolved.content, font).width - FontCache.getMeasureText(glyph.content, font).width) * getTextHorizontalScale((_glyph$ts2 = glyph.ts) === null || _glyph$ts2 === void 0 ? void 0 : _glyph$ts2.sa) : -glyph.width;
+				shapedGlyphs[glyphIndex] = {
+					...resolved,
+					width: Math.max(0, glyph.width + widthDelta),
+					bBox: {
+						...glyph.bBox,
+						width: Math.max(0, glyph.bBox.width + widthDelta)
+					}
+				};
+			}
+		}
 		appendShapedText(shapedTextList, shapedGlyphs, bk.type, paragraphStyle.fixedTabStops === BooleanNumber.TRUE);
 		last = bk.position;
 	}
@@ -21106,8 +21246,7 @@ function shaping(ctx, content, viewModel, paragraphNode, sectionBreakConfig) {
 //#endregion
 //#region src/components/docs/layout/document-layout-page-patch.ts
 function withoutParent(value) {
-	const copy = { ...value };
-	delete copy.parent;
+	const { parent: _parent, ...copy } = value;
 	return copy;
 }
 function serializeDivide(source) {
@@ -21175,10 +21314,10 @@ function serializeDocumentSkeletonPage(source, omitResourceSources = false) {
 	return {
 		...geometry,
 		sections: source.sections.map(serializeSection),
-		noteDecorations: noteDecorations === null || noteDecorations === void 0 ? void 0 : noteDecorations.map((decoration) => ({
+		...noteDecorations == null ? {} : { noteDecorations: noteDecorations.map((decoration) => ({
 			...decoration,
 			page: serializeDocumentSkeletonPage(decoration.page, omitResourceSources)
-		})),
+		})) },
 		...notes == null ? {} : { notes: notes.map((note) => ({
 			...withoutParent(note),
 			page: serializeDocumentSkeletonPage(note.page, omitResourceSources)
@@ -21318,18 +21457,18 @@ function hydrateDocumentSkeletonPageMaterializationPlaceholder(source, parent) {
 	return placeholder;
 }
 function hydrateDocumentSkeletonPageInternal(source, parent, snapshot, resourceSegmentId) {
-	var _source$noteDecoratio, _source$notes;
+	const { notes, noteDecorations, ...geometry } = source;
 	const page = {
-		...source,
+		...geometry,
 		sections: [],
-		noteDecorations: (_source$noteDecoratio = source.noteDecorations) === null || _source$noteDecoratio === void 0 ? void 0 : _source$noteDecoratio.map((decoration) => ({
+		...noteDecorations == null ? {} : { noteDecorations: noteDecorations.map((decoration) => ({
 			...decoration,
 			page: hydrateDocumentSkeletonPageInternal(decoration.page, void 0, snapshot, decoration.page.segmentId)
-		})),
-		notes: (_source$notes = source.notes) === null || _source$notes === void 0 ? void 0 : _source$notes.map((note) => ({
+		})) },
+		...notes == null ? {} : { notes: notes.map((note) => ({
 			...note,
 			page: hydrateDocumentSkeletonPageInternal(note.page, void 0, snapshot, note.noteId)
-		})),
+		})) },
 		skeDrawings: new Map(source.skeDrawings.map(([drawingId, drawing]) => [drawingId, hydrateDrawing(drawing, snapshot, resourceSegmentId)])),
 		skeTables: /* @__PURE__ */ new Map(),
 		skeColumnGroups: /* @__PURE__ */ new Map(),
@@ -23202,6 +23341,8 @@ function serializePaginatedContinuationCheckpoint(page) {
 		sectionId: page.sectionId,
 		headerId: page.headerId,
 		footerId: page.footerId,
+		headerLayoutKey: page.headerLayoutKey,
+		footerLayoutKey: page.footerLayoutKey,
 		pageWidth: page.pageWidth,
 		pageHeight: page.pageHeight,
 		pageOrient: page.pageOrient,
@@ -23278,7 +23419,7 @@ function getSegmentPageFromRelativePath(skeletonData, segmentPageIndex, path) {
 	const rootPage = skeletonData.pages[segmentPageIndex];
 	if (rootPage == null) return null;
 	const { headerId, footerId, pageWidth } = rootPage;
-	const segmentPages = [headerId == null ? null : (_skeletonData$skeHead = skeletonData.skeHeaders.get(headerId)) === null || _skeletonData$skeHead === void 0 ? void 0 : _skeletonData$skeHead.get(pageWidth), footerId == null ? null : (_skeletonData$skeFoot = skeletonData.skeFooters.get(footerId)) === null || _skeletonData$skeFoot === void 0 ? void 0 : _skeletonData$skeFoot.get(pageWidth)];
+	const segmentPages = [headerId == null ? null : (_skeletonData$skeHead = skeletonData.skeHeaders.get(headerId)) === null || _skeletonData$skeHead === void 0 ? void 0 : _skeletonData$skeHead.get(rootPage.headerLayoutKey ?? pageWidth), footerId == null ? null : (_skeletonData$skeFoot = skeletonData.skeFooters.get(footerId)) === null || _skeletonData$skeFoot === void 0 ? void 0 : _skeletonData$skeFoot.get(rootPage.footerLayoutKey ?? pageWidth)];
 	for (const segmentPage of segmentPages) {
 		if (segmentPage == null) continue;
 		const page = getPageFromPath({
@@ -23309,6 +23450,7 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 		_defineProperty(this, "_languageDetector", LanguageDetector.getInstance());
 		_defineProperty(this, "_initialWidth", 0);
 		_defineProperty(this, "_paginationMetrics", null);
+		_defineProperty(this, "_completedPageCount", void 0);
 		_defineProperty(this, "_lastCompleteSkeletonData", null);
 		_defineProperty(this, "_pendingInvalidationAnchor", null);
 		_defineProperty(this, "_layoutGeneration", 0);
@@ -23321,7 +23463,9 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 		_defineProperty(this, "_isolateIncrementalPublications", void 0);
 		_defineProperty(this, "_modernPageWidth", void 0);
 		_defineProperty(this, "_modernHorizontalMargin", void 0);
+		_defineProperty(this, "_lineGap", void 0);
 		this._isolateIncrementalPublications = options.isolateIncrementalPublications !== false;
+		this._lineGap = options.lineGap ?? 0;
 	}
 	static create(docViewModel, localeService, options) {
 		return new DocumentSkeleton(docViewModel, localeService, options);
@@ -23333,6 +23477,7 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 		this._layoutPageMaterialized$.complete();
 		this._skeletonData = null;
 		this._lastCompleteSkeletonData = null;
+		this._completedPageCount = void 0;
 		this._pendingInvalidationAnchor = null;
 		this._externalLayoutProgress = null;
 		this._externalProtectedPages = null;
@@ -23350,14 +23495,21 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 	* PS: This method has significant impact on performance.
 	*/
 	calculate(bounds) {
+		var _this$_skeletonData;
 		if (!this.dirty) return;
 		this.cancelIncrementalLayout();
 		this._externalLayoutProgress = null;
 		this._externalProtectedPages = null;
 		this._externalProtectedContinuousLayout = null;
-		const ctx = this._prepareLayoutContext();
-		this._skeletonData = this._createSkeleton(ctx, bounds);
+		let ctx = this._prepareLayoutContext();
+		while (true) {
+			this._skeletonData = this._createSkeleton(ctx, bounds);
+			const retry = this._prepareFieldCountRetry(ctx);
+			if (retry == null) break;
+			ctx = retry;
+		}
 		this._lastCompleteSkeletonData = this._skeletonData;
+		this._completedPageCount = (_this$_skeletonData = this._skeletonData) === null || _this$_skeletonData === void 0 ? void 0 : _this$_skeletonData.pages.length;
 		this._pendingInvalidationAnchor = null;
 		this._paginationMetrics = ctx.paginationMetrics ?? null;
 		this._dirty$.next(true);
@@ -23431,6 +23583,7 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 			lastPublishedBlockCount: incrementalStart.processedBlockCount,
 			publicationRevision: 0,
 			reuseUnaffectedTail: (options === null || options === void 0 ? void 0 : options.reuseUnaffectedTail) !== false,
+			paginationRevision: 0,
 			allowMetadataOnlyStructuralTailReuse: (options === null || options === void 0 ? void 0 : options.allowMetadataOnlyStructuralTailReuse) === true,
 			reusedTail: false,
 			tailConvergencePageCount: incrementalStart.ctx.skeleton.pages.length,
@@ -23477,7 +23630,7 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 		const hasEarlierOverlappingRange = anchorPageIndex > 0 && previousSkeleton.pages.slice(0, anchorPageIndex).some((page) => previousAnchor >= page.st && previousAnchor <= page.ed);
 		const anchorBlockOwnsTable = blocks[anchorBlockIndex].block.children.some((child) => child.nodeType === DataStreamTreeNodeType.TABLE && anchor >= child.startIndex && anchor <= child.endIndex);
 		const canResumePlainParagraph = blocks[anchorBlockIndex].block.nodeType === DataStreamTreeNodeType.PARAGRAPH && blocks[anchorBlockIndex].block.children.length === 0;
-		if (mode === "paginated" && reuseInteractionPagePrefix && canResumePlainParagraph && !((_previousSkeleton$pag = previousSkeleton.pages[anchorPageIndex]) === null || _previousSkeleton$pag === void 0 || (_previousSkeleton$pag = _previousSkeleton$pag.notes) === null || _previousSkeleton$pag === void 0 ? void 0 : _previousSkeleton$pag.length)) {
+		if (mode === "paginated" && reuseInteractionPagePrefix && invalidation != null && canResumePlainParagraph && !((_previousSkeleton$pag = previousSkeleton.pages[anchorPageIndex]) === null || _previousSkeleton$pag === void 0 || (_previousSkeleton$pag = _previousSkeleton$pag.notes) === null || _previousSkeleton$pag === void 0 ? void 0 : _previousSkeleton$pag.length)) {
 			const interactionPreviousAnchor = mapCurrentOffsetToPrevious(anchor, invalidation);
 			const interactionPageIndex = interactionSkeleton == null ? -1 : this._findBodyPageIndex(interactionSkeleton.pages, interactionPreviousAnchor);
 			const paginatedPrefix = this._preparePaginatedParagraphPrefix(ctx, interactionSkeleton ?? previousSkeleton, blocks[anchorBlockIndex], anchorBlockIndex, interactionPageIndex, invalidation);
@@ -23807,11 +23960,13 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 		const publishedPageCount = state.mode === "continuous" ? pageCount : state.complete ? state.reusedTail ? pageCount : shouldPublishPriority ? Math.max(state.lastPublishedPageCount, priorityPublishedPageCount) : Math.min(pageCount, state.lastPublishedPageCount + 1) : shouldPublishPriority ? Math.max(state.lastPublishedPageCount, priorityPublishedPageCount) : Math.min(stableComputedPageCount, state.lastPublishedPageCount + 1);
 		let didPublish = false;
 		let didPublishAnchor = false;
-		if (!state.cancelled && canPublish && (!suppressPreAnchorPublication || shouldPublishPriority || state.complete)) {
+		if (!state.cancelled && canPublish && (state.ctx.fieldCountCandidates == null || state.complete) && (!suppressPreAnchorPublication || shouldPublishPriority || state.complete)) {
 			if (state.mode === "paginated") this._finalizePaginatedPagesForPublication(state, publishedPageCount);
 			const isFinalPublication = state.complete && publishedPageCount >= pageCount;
 			if (isFinalPublication) {
+				var _state$ctx$skeleton;
 				this._lastCompleteSkeletonData = state.ctx.skeleton;
+				this._completedPageCount = (_state$ctx$skeleton = state.ctx.skeleton) === null || _state$ctx$skeleton === void 0 ? void 0 : _state$ctx$skeleton.pages.length;
 				this._pendingInvalidationAnchor = null;
 			}
 			this._skeletonData = isFinalPublication ? state.ctx.skeleton : !this._isolateIncrementalPublications && state.mode === "paginated" ? this._createSharedPublishablePartialSkeleton(state, publishedPageCount) : this._createPublishablePartialSkeleton(state, publishedPageCount);
@@ -23953,9 +24108,9 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 	* page or block range while the external executor publishes a newer tail.
 	*/
 	beginExternalLayout(options) {
-		var _this$_skeletonData;
+		var _this$_skeletonData2;
 		this.cancelIncrementalLayout();
-		const pages = ((_this$_skeletonData = this._skeletonData) === null || _this$_skeletonData === void 0 ? void 0 : _this$_skeletonData.pages) ?? [];
+		const pages = ((_this$_skeletonData2 = this._skeletonData) === null || _this$_skeletonData2 === void 0 ? void 0 : _this$_skeletonData2.pages) ?? [];
 		const protectedRange = options.protectedRange;
 		const protectedPageRange = (protectedRange === null || protectedRange === void 0 ? void 0 : protectedRange.mode) === "paginated" ? protectedRange : void 0;
 		if (protectedPageRange == null) this._externalProtectedPages = null;
@@ -24112,6 +24267,7 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 			if (progress.complete) {
 				setPageParent(skeletonData.pages, skeletonData);
 				this._lastCompleteSkeletonData = skeletonData;
+				this._completedPageCount = skeletonData === null || skeletonData === void 0 ? void 0 : skeletonData.pages.length;
 				this._pendingInvalidationAnchor = null;
 				this._externalProtectedContinuousLayout = null;
 			}
@@ -24181,6 +24337,7 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 			if (publicationToApply.resources.drawingAnchor != null) skeletonData.drawingAnchor = hydrateDrawingAnchors(publicationToApply.resources.drawingAnchor);
 			setPageParent(skeletonData.pages, skeletonData);
 			this._lastCompleteSkeletonData = skeletonData;
+			this._completedPageCount = skeletonData === null || skeletonData === void 0 ? void 0 : skeletonData.pages.length;
 			this._pendingInvalidationAnchor = null;
 			this._externalProtectedPages = null;
 			this._externalProtectedContinuousLayout = null;
@@ -24390,8 +24547,8 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 		};
 	}
 	findBodyPageIndexByCharIndex(charIndex) {
-		var _this$_skeletonData2;
-		return this._findBodyPageIndex(((_this$_skeletonData2 = this._skeletonData) === null || _this$_skeletonData2 === void 0 ? void 0 : _this$_skeletonData2.pages) ?? [], charIndex);
+		var _this$_skeletonData3;
+		return this._findBodyPageIndex(((_this$_skeletonData3 = this._skeletonData) === null || _this$_skeletonData3 === void 0 ? void 0 : _this$_skeletonData3.pages) ?? [], charIndex);
 	}
 	findNodeByCharIndex(charIndex, segmentId = "", segmentPageIndex = -1) {
 		const nodes = this._findNodeByIndex(charIndex, segmentId, segmentPageIndex);
@@ -24410,12 +24567,12 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 			const { headerId, footerId, pageWidth } = skePage;
 			if (pageType === 1) {
 				var _skeHeaders$get;
-				const skeHeader = (_skeHeaders$get = skeHeaders.get(headerId)) === null || _skeHeaders$get === void 0 ? void 0 : _skeHeaders$get.get(pageWidth);
+				const skeHeader = (_skeHeaders$get = skeHeaders.get(headerId)) === null || _skeHeaders$get === void 0 ? void 0 : _skeHeaders$get.get(skePage.headerLayoutKey ?? pageWidth);
 				if (skeHeader == null) return;
 				else skePage = skeHeader;
 			} else if (pageType === 2) {
 				var _skeFooters$get;
-				const skeFooter = (_skeFooters$get = skeFooters.get(footerId)) === null || _skeFooters$get === void 0 ? void 0 : _skeFooters$get.get(pageWidth);
+				const skeFooter = (_skeFooters$get = skeFooters.get(footerId)) === null || _skeFooters$get === void 0 ? void 0 : _skeFooters$get.get(skePage.footerLayoutKey ?? pageWidth);
 				if (skeFooter == null) return;
 				else skePage = skeFooter;
 			}
@@ -24523,9 +24680,9 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 			let exactMatch = null;
 			if (editArea === "HEADER" || editArea === "FOOTER") {
 				var _skeHeaders$get2, _skeFooters$get2;
-				const headerSke = (_skeHeaders$get2 = skeHeaders.get(headerId)) === null || _skeHeaders$get2 === void 0 ? void 0 : _skeHeaders$get2.get(pageWidth);
+				const headerSke = (_skeHeaders$get2 = skeHeaders.get(headerId)) === null || _skeHeaders$get2 === void 0 ? void 0 : _skeHeaders$get2.get(page.headerLayoutKey ?? pageWidth);
 				if (headerSke) exactMatch = this._collectNearestNode(headerSke, 1, page, headerId, pi, cache, x, y, pageLength);
-				const footerSke = (_skeFooters$get2 = skeFooters.get(footerId)) === null || _skeFooters$get2 === void 0 ? void 0 : _skeFooters$get2.get(pageWidth);
+				const footerSke = (_skeFooters$get2 = skeFooters.get(footerId)) === null || _skeFooters$get2 === void 0 ? void 0 : _skeFooters$get2.get(page.footerLayoutKey ?? pageWidth);
 				if (footerSke) exactMatch = exactMatch ?? this._collectNearestNode(footerSke, 2, page, footerId, pi, cache, x, y, pageLength);
 			} else exactMatch = this._collectNearestNode(page, 0, page, "", pi, cache, x, y, pageLength);
 			if (exactMatch) return exactMatch;
@@ -24547,9 +24704,9 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 				const { headerId, footerId, pageWidth } = page;
 				if (segmentId !== "" && !this._docViewModel.getNoteTreeMap().has(segmentId)) {
 					var _skeHeaders$get3, _skeFooters$get3;
-					const headerSke = (_skeHeaders$get3 = skeHeaders.get(headerId)) === null || _skeHeaders$get3 === void 0 ? void 0 : _skeHeaders$get3.get(pageWidth);
+					const headerSke = (_skeHeaders$get3 = skeHeaders.get(headerId)) === null || _skeHeaders$get3 === void 0 ? void 0 : _skeHeaders$get3.get(page.headerLayoutKey ?? pageWidth);
 					if (headerSke) exactMatch = this._collectNearestNode(headerSke, 1, page, headerId, pi, cache, x, y, pageLength);
-					const footerSke = (_skeFooters$get3 = skeFooters.get(footerId)) === null || _skeFooters$get3 === void 0 ? void 0 : _skeFooters$get3.get(pageWidth);
+					const footerSke = (_skeFooters$get3 = skeFooters.get(footerId)) === null || _skeFooters$get3 === void 0 ? void 0 : _skeFooters$get3.get(page.footerLayoutKey ?? pageWidth);
 					if (footerSke) exactMatch = exactMatch ?? this._collectNearestNode(footerSke, 2, page, footerId, pi, cache, x, y, pageLength);
 				} else exactMatch = this._collectNearestNode(page, 0, page, "", pi, cache, x, y, pageLength);
 				if (exactMatch) return exactMatch;
@@ -24564,7 +24721,7 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 						continue;
 					}
 					const { headerId, pageWidth } = page;
-					const segmentSke = segmentId === headerId ? (_skeHeaders$get4 = skeHeaders.get(segmentId)) === null || _skeHeaders$get4 === void 0 ? void 0 : _skeHeaders$get4.get(pageWidth) : (_skeFooters$get4 = skeFooters.get(segmentId)) === null || _skeFooters$get4 === void 0 ? void 0 : _skeFooters$get4.get(pageWidth);
+					const segmentSke = segmentId === headerId ? (_skeHeaders$get4 = skeHeaders.get(segmentId)) === null || _skeHeaders$get4 === void 0 ? void 0 : _skeHeaders$get4.get(page.headerLayoutKey ?? pageWidth) : (_skeFooters$get4 = skeFooters.get(segmentId)) === null || _skeFooters$get4 === void 0 ? void 0 : _skeFooters$get4.get(page.footerLayoutKey ?? pageWidth);
 					if (segmentSke) exactMatch = this._collectNearestNode(segmentSke, segmentId === headerId ? 1 : 2, page, segmentId, segmentPage, cache, x, y, pageLength);
 				} else exactMatch = this._collectNearestNode(page, 0, page, "", pi, cache, x, y, pageLength);
 				if (exactMatch) return exactMatch;
@@ -24734,11 +24891,13 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 					if (!isHitTestAddressableGlyph(glyph)) continue;
 					const startX = divideLeft + glyph.left;
 					const endX = startX + glyph.width;
+					const contentTop = startY + (line.marginTop ?? 0) + (line.paddingTop ?? 0);
 					const node = {
 						node: glyph,
 						...segment,
 						ratioX: x / (startX + endX),
-						ratioY: y / (startY + endY)
+						ratioY: y / (startY + endY),
+						isInsideGlyph: x >= startX && x <= endX && y >= contentTop && y <= contentTop + line.contentHeight
 					};
 					if (sameLine && x >= startX && x <= endX) return node;
 					if (distanceY < nearestDistanceY) {
@@ -24789,7 +24948,8 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 						node: glyph,
 						...segment,
 						ratioX: x / (startX + endX),
-						ratioY: y / (startY + endY)
+						ratioY: y / (startY + endY),
+						isInsideGlyph: x >= startX && x <= endX && sameLine
 					};
 					const hitsGlyphAdvance = x >= startX && x <= endX;
 					if (sameLine) {
@@ -24891,6 +25051,7 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 		return {
 			generation: state.generation,
 			publicationRevision: state.publicationRevision,
+			paginationRevision: state.paginationRevision,
 			didPublish,
 			didPublishAnchor,
 			publishedPageCount: state.lastPublishedPageCount,
@@ -25358,6 +25519,7 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 		const section = sections[sectionIndex];
 		const paragraphIndex = Math.max(0, (section === null || section === void 0 ? void 0 : section.children.findIndex(({ endIndex }) => endIndex === layoutAnchor)) ?? 0);
 		const processedBeforeSection = sections.slice(0, sectionIndex).reduce((count, item) => count + item.children.length, 0);
+		rollbackSectionPages(layoutAnchor, ctx.skeleton.pages);
 		state.sectionIndex = sectionIndex;
 		state.paragraphIndex = paragraphIndex;
 		state.sectionInitialized = false;
@@ -25410,10 +25572,52 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 		}
 		for (const hSkeMap of skeleton.skeHeaders.values()) for (const page of hSkeMap.values()) updateInlineDrawingCoordsAndBorder(ctx, [page]);
 		for (const fSkeMap of skeleton.skeFooters.values()) for (const page of fSkeMap.values()) updateInlineDrawingCoordsAndBorder(ctx, [page]);
+		const retry = this._prepareFieldCountRetry(ctx);
+		if (retry != null) {
+			state.paginationRevision++;
+			state.ctx = retry;
+			state.sectionIndex = 0;
+			state.paragraphIndex = 0;
+			state.sectionInitialized = false;
+			state.sectionBreakConfig = null;
+			state.layoutAnchor = null;
+			state.laidOutThrough = -1;
+			state.stableLaidOutThrough = -1;
+			state.processedBlockCount = 0;
+			state.pendingTableBuild = null;
+			state.pendingSlicedTableBuild = null;
+			state.pendingParagraphCheckpoint = null;
+			state.stablePageCount = 0;
+			state.finalizedPageCount = 0;
+			state.lastPublishedPageCount = 0;
+			state.lastPublishedBlockCount = 0;
+			state.anchorPublished = false;
+			state.reuseUnaffectedTail = false;
+			state.reusedTail = false;
+			state.tailConvergencePageCount = 0;
+			state.interactionPageTail = null;
+			state.interactionPageComplete = false;
+			state.interactionWindowComplete = false;
+			state.interactionWindowResume = null;
+			return;
+		}
 		setPageParent(skeleton.pages, skeleton);
 		state.complete = true;
 		state.stableLaidOutThrough = state.laidOutThrough;
 	}
+	getCompletedPageCount() {
+		return this._completedPageCount;
+	}
+	_prepareFieldCountRetry(ctx) {
+		if (!ctx.hasNumPagesFields || ctx.fieldPageCount === ctx.skeleton.pages.length) return null;
+		const retry = this._prepareLayoutContext();
+		retry.fieldPageCount = ctx.skeleton.pages.length;
+		retry.headerFooterMinimumMargins = ctx.headerFooterMinimumMargins;
+		retry.fieldCountCandidates = ctx.fieldCountCandidates ?? /* @__PURE__ */ new Set();
+		if (ctx.fieldPageCount != null) retry.fieldCountCandidates.add(ctx.fieldPageCount);
+		retry.fieldCountCycle = ctx.fieldCountCycle || retry.fieldCountCandidates.has(retry.fieldPageCount);
+		return retry;
+	}
 	_prepareLayoutContext() {
 		var _ctx$noteReferences;
 		const viewModel = this.getViewModel();
@@ -25426,6 +25630,7 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 		};
 		const { paragraphLineGapDefault = 0, defaultTabStop = 10.5, textStyle = {}, adjustLineHeightInTable = BooleanNumber.FALSE } = documentStyle;
 		const docsConfig = {
+			lineGap: this._lineGap,
 			headerTreeMap,
 			footerTreeMap,
 			lists,
@@ -25445,7 +25650,17 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 			skeListLevel,
 			drawingAnchor
 		};
+		const hasNumPagesFields = [...headerTreeMap.values(), ...footerTreeMap.values()].some((story) => {
+			var _story$getBody;
+			return (_story$getBody = story.getBody()) === null || _story$getBody === void 0 || (_story$getBody = _story$getBody.customRanges) === null || _story$getBody === void 0 ? void 0 : _story$getBody.some((range) => {
+				var _range$properties;
+				return range.rangeType === CustomRangeType.FIELD && ((_range$properties = range.properties) === null || _range$properties === void 0 ? void 0 : _range$properties.fieldType) === "NUMPAGES" && range.properties.locked !== BooleanNumber.TRUE;
+			});
+		});
 		const ctx = {
+			fieldPageCount: this.getCompletedPageCount(),
+			hasNumPagesFields,
+			headerFooterMinimumMargins: hasNumPagesFields ? /* @__PURE__ */ new Map() : void 0,
 			viewModel,
 			dataModel,
 			noteReferences: documentStyle.documentFlavor === DocumentFlavor.TRADITIONAL ? resolveNoteReferences(dataModel.getSnapshot()) : void 0,
@@ -25641,8 +25856,8 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 			let segmentPage = page;
 			if (segmentId) {
 				var _skeHeaders$get5, _skeFooters$get5, _page$notes3;
-				const maybeHeaderSke = (_skeHeaders$get5 = skeHeaders.get(segmentId)) === null || _skeHeaders$get5 === void 0 ? void 0 : _skeHeaders$get5.get(pageWidth);
-				const maybeFooterSke = (_skeFooters$get5 = skeFooters.get(segmentId)) === null || _skeFooters$get5 === void 0 ? void 0 : _skeFooters$get5.get(pageWidth);
+				const maybeHeaderSke = (_skeHeaders$get5 = skeHeaders.get(segmentId)) === null || _skeHeaders$get5 === void 0 ? void 0 : _skeHeaders$get5.get(page.headerLayoutKey ?? pageWidth);
+				const maybeFooterSke = (_skeFooters$get5 = skeFooters.get(segmentId)) === null || _skeFooters$get5 === void 0 ? void 0 : _skeFooters$get5.get(page.footerLayoutKey ?? pageWidth);
 				const note = (_page$notes3 = page.notes) === null || _page$notes3 === void 0 ? void 0 : _page$notes3.find((fragment) => fragment.noteId === segmentId && fragment.page.st <= charIndex && charIndex <= fragment.page.ed);
 				if (note) segmentPage = note.page;
 				else if (maybeHeaderSke) segmentPage = maybeHeaderSke;
@@ -25711,7 +25926,7 @@ var DocumentSkeleton = class DocumentSkeleton extends Skeleton {
 };
 
 //#endregion
-//#region \0@oxc-project+runtime@0.149.0/helpers/esm/decorateParam.js
+//#region \0@oxc-project+runtime@0.153.0/helpers/esm/decorateParam.js
 function __decorateParam(paramIndex, decorator) {
 	return function(target, key) {
 		decorator(target, key, paramIndex);
@@ -25719,7 +25934,7 @@ function __decorateParam(paramIndex, decorator) {
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.149.0/helpers/esm/decorate.js
+//#region \0@oxc-project+runtime@0.153.0/helpers/esm/decorate.js
 function __decorate(decorators, target, key, desc) {
 	var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
 	if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -25846,6 +26061,8 @@ let SpreadsheetSkeleton = class SpreadsheetSkeleton extends SheetSkeleton {
 		_defineProperty(this, "_gridlinesColor", void 0);
 		_defineProperty(this, "_defaultGridlinesColor", void 0);
 		_defineProperty(this, "_scene", null);
+		_defineProperty(this, "textLineGap", void 0);
+		this.textLineGap = _configService.getConfig(SHEET_TEXT_LINE_GAP) ?? 0;
 		const themeService = _injector.get(ThemeService);
 		this.disposeWithMe(themeService.currentTheme$.subscribe(() => {
 			var _this$_scene, _this$_scene2;
@@ -26176,7 +26393,7 @@ let SpreadsheetSkeleton = class SpreadsheetSkeleton extends SheetSkeleton {
 			const documentViewModel = new DocumentViewModel(documentModel);
 			const { vertexAngle: angle } = convertTextRotation(textRotation);
 			if (typeof colWidth === "number" && wrapStrategy === WrapStrategy.WRAP) documentModel.updateDocumentDataPageSize(colWidth);
-			const documentSkeleton = DocumentSkeleton.create(documentViewModel, this._localeService);
+			const documentSkeleton = DocumentSkeleton.create(documentViewModel, this._localeService, { lineGap: this.textLineGap });
 			documentSkeleton.calculate();
 			let { height: h = 0 } = getDocsSkeletonPageSize(documentSkeleton, angle) ?? {};
 			if (documentSkeleton) {
@@ -26194,7 +26411,7 @@ let SpreadsheetSkeleton = class SpreadsheetSkeleton extends SheetSkeleton {
 			const paddingTop = ((_style$pd3 = style.pd) === null || _style$pd3 === void 0 ? void 0 : _style$pd3.t) ?? DEFAULT_PADDING_DATA.t;
 			const paddingBottom = ((_style$pd4 = style.pd) === null || _style$pd4 === void 0 ? void 0 : _style$pd4.b) ?? DEFAULT_PADDING_DATA.b;
 			if ((style === null || style === void 0 ? void 0 : style.tb) === WrapStrategy.WRAP) {
-				const skeleton = new DocSimpleSkeleton(getDisplayValueFromCell(cell), getFontStyleString(style).fontCache, (style === null || style === void 0 ? void 0 : style.tb) === WrapStrategy.WRAP, colWidth - paddingLeft - paddingRight, Infinity);
+				const skeleton = new DocSimpleSkeleton(getDisplayValueFromCell(cell), getFontStyleString(style).fontCache, (style === null || style === void 0 ? void 0 : style.tb) === WrapStrategy.WRAP, colWidth - paddingLeft - paddingRight, Infinity, this.textLineGap);
 				skeleton.calculate();
 				return skeleton.getTotalHeight() + paddingTop + paddingBottom;
 			} else {
@@ -26310,7 +26527,7 @@ let SpreadsheetSkeleton = class SpreadsheetSkeleton extends SheetSkeleton {
 		const { vertexAngle: angle } = convertTextRotation(textRotation);
 		if ((style === null || style === void 0 ? void 0 : style.tb) === WrapStrategy.WRAP) documentModel.updateDocumentDataPageSize(currColWidth, Infinity);
 		else documentModel.updateDocumentDataPageSize(Infinity, Infinity);
-		const documentSkeleton = DocumentSkeleton.create(documentViewModel, this._localeService);
+		const documentSkeleton = DocumentSkeleton.create(documentViewModel, this._localeService, { lineGap: this.textLineGap });
 		documentSkeleton.calculate();
 		measuredWidth = (getDocsSkeletonPageSize(documentSkeleton, angle) ?? { width: 0 }).width;
 		if (documentSkeleton) {
@@ -26593,7 +26810,7 @@ let SpreadsheetSkeleton = class SpreadsheetSkeleton extends SheetSkeleton {
 		if (fontCache.documentSkeleton) {
 			const snapshot = fontCache.documentSkeleton.getViewModel().getDataModel().getSnapshot();
 			const documentModel = new DocumentDataModel(scaleDocumentDataForShrinkToFit(snapshot, scale, fallbackFontSize));
-			const documentSkeleton = DocumentSkeleton.create(new DocumentViewModel(documentModel), this._localeService);
+			const documentSkeleton = DocumentSkeleton.create(new DocumentViewModel(documentModel), this._localeService, { lineGap: this.textLineGap });
 			documentSkeleton.calculate();
 			fontCache.documentSkeleton = documentSkeleton;
 		} else fontCache.fontString = getFontStyleString({
@@ -26646,7 +26863,7 @@ let SpreadsheetSkeleton = class SpreadsheetSkeleton extends SheetSkeleton {
 				if (FULL_WIDTH_HORIZONTAL_ALIGNMENTS.has(horizontalAlign)) updateDocumentPageWidth(documentModel, this.getCellWithCoordByIndex(row, col, false));
 				const documentViewModel = new DocumentViewModel(documentModel);
 				if (documentViewModel) {
-					const documentSkeleton = DocumentSkeleton.create(documentViewModel, this._localeService);
+					const documentSkeleton = DocumentSkeleton.create(documentViewModel, this._localeService, { lineGap: this.textLineGap });
 					documentSkeleton.calculate();
 					config = {
 						documentSkeleton,
@@ -27110,7 +27327,7 @@ var Font = class extends SheetExtension {
 		this._clipByRenderBounds(renderFontCtx, row, col);
 		ctx.translate(renderFontCtx.startX + FIX_ONE_PIXEL_BLUR_OFFSET, renderFontCtx.startY + FIX_ONE_PIXEL_BLUR_OFFSET);
 		if (fontCache.documentSkeleton) this._renderDocuments(ctx, row, col, renderFontCtx, spreadsheetSkeleton.overflowCache);
-		else this._renderText(ctx, row, col, renderFontCtx, spreadsheetSkeleton.overflowCache);
+		else this._renderText(ctx, renderFontCtx);
 		ctx.restore();
 		if (fontCache.documentSkeleton) {
 			var _documentDataModel$ge;
@@ -27205,7 +27422,7 @@ var Font = class extends SheetExtension {
 					if (image.getAttribute("data-error") === "true") this._drawFallbackImage(ctx, -rotatedWidth / 2, -rotatedHeight / 2, width, height);
 					else try {
 						ctx.drawImage(image, -rotatedWidth / 2, -rotatedHeight / 2, width, height);
-					} catch (e) {
+					} catch {
 						this._drawFallbackImage(ctx, -rotatedWidth / 2, -rotatedHeight / 2, width, height);
 					}
 					ctx.restore();
@@ -27218,7 +27435,7 @@ var Font = class extends SheetExtension {
 	* @param renderFontContext
 	* @param row
 	* @param col
-	* @param fontCache
+	* @param padding
 	*/
 	_clipByRenderBounds(renderFontContext, row, col, padding = 0) {
 		var _fontCache$cellData3, _fontCache$cellData4;
@@ -27262,7 +27479,7 @@ var Font = class extends SheetExtension {
 		renderFontContext.endX = endX;
 		renderFontContext.endY = endY;
 	}
-	_renderText(ctx, row, col, renderFontCtx, overflowCache) {
+	_renderText(ctx, renderFontCtx) {
 		var _fontCache$style5, _fontCache$style6, _fontCache$style7, _fontCache$style8, _fontCache$style9;
 		const { fontCache } = renderFontCtx;
 		if (!fontCache) return;
@@ -27282,6 +27499,7 @@ var Font = class extends SheetExtension {
 			text,
 			fontStyle: fontCache.fontString,
 			warp: wrapStrategy === WrapStrategy.WRAP && vertexAngle === 0,
+			lineGap: renderFontCtx.spreadsheetSkeleton.textLineGap,
 			hAlign,
 			vAlign: fontCache.verticalAlign,
 			width: cellWidth,
@@ -27705,6 +27923,290 @@ var SpreadsheetRowHeader = class extends SpreadsheetHeader {
 	}
 };
 
+//#endregion
+//#region src/group.ts
+var Group = class extends BaseObject {
+	constructor(key, ...objects) {
+		super(key);
+		_defineProperty(this, "_objects", []);
+		_defineProperty(this, "_selfSizeMode", false);
+		this.addObjects(...objects);
+	}
+	get classType() {
+		return "Group";
+	}
+	set cursor(val) {
+		this.setCursor(val);
+	}
+	getState() {
+		if (this._selfSizeMode) return super.getState();
+		return getGroupState(this.left, this.top, this._objects.map((o) => o.getState()));
+	}
+	get width() {
+		if (this._selfSizeMode) return super.width;
+		return this.getState().width || 0;
+	}
+	get height() {
+		if (this._selfSizeMode) return super.height;
+		return this.getState().height || 0;
+	}
+	set width(val) {
+		if (this._selfSizeMode) {
+			super.width = val;
+			return;
+		}
+		const numDelta = val - this.width;
+		this._objects.forEach((o) => {
+			o.resize(o.width + numDelta);
+		});
+	}
+	set height(val) {
+		if (this._selfSizeMode) {
+			super.height = val;
+			return;
+		}
+		const numDelta = val - this.height;
+		this._objects.forEach((o) => {
+			o.resize(void 0, o.height + numDelta);
+		});
+	}
+	get maxZIndex() {
+		let maxZIndex = 0;
+		for (const object of this._objects) maxZIndex = Math.max(maxZIndex, object.zIndex);
+		return maxZIndex;
+	}
+	openSelfSizeMode() {
+		this._selfSizeMode = true;
+	}
+	closeSelfSizeMode() {
+		this._selfSizeMode = false;
+	}
+	reCalculateObjects() {
+		if (this._selfSizeMode) return;
+		const { left = 0, top = 0 } = this.getState();
+		for (const object of this._objects) object.transformByState({
+			left: object.left - left,
+			top: object.top - top
+		});
+		this.transformByState({
+			left,
+			top
+		});
+	}
+	addObjects(...objects) {
+		for (const object of objects) this.addObject(object);
+	}
+	addObject(o) {
+		let object = o;
+		if (isString(o)) {
+			const scene = this.getScene();
+			object = scene === null || scene === void 0 ? void 0 : scene.getObject(o);
+			if (!object) return;
+			object.parent = this;
+			object.isInGroup = true;
+			object.groupKey = this.oKey;
+			this._objects.push(object);
+		} else {
+			o.parent = this;
+			o.isInGroup = true;
+			o.groupKey = this.oKey;
+			this._objects.push(o);
+		}
+	}
+	removeObject(object) {
+		const objects = this.getObjects();
+		const objectsLength = objects.length;
+		if (isString(object)) for (let i = 0; i < objectsLength; i++) {
+			const o = objects[i];
+			if (o.oKey === object) {
+				objects.splice(i, 1);
+				this.parent.removeObject(o);
+				return;
+			}
+		}
+		else for (let i = 0; i < objectsLength; i++) {
+			const o = objects[i];
+			if (o === object) {
+				objects.splice(i, 1);
+				this.parent.removeObject(o);
+				return;
+			}
+		}
+	}
+	removeSelfObjectAndTransform(oKey, width, height, isTransform = false) {
+		const objects = [...this.getObjects()];
+		const objectsLength = objects.length;
+		if (width == null) width = this.width;
+		if (height == null) height = this.height;
+		for (let i = 0; i < objectsLength; i++) {
+			const o = objects[i];
+			if (o.oKey === oKey) {
+				objects.splice(i, 1);
+				isTransform && this._transformObject(o, width, height);
+				o.parent = this.parent;
+				o.groupKey = void 0;
+				o.isInGroup = false;
+				this._objects = objects;
+				return;
+			}
+		}
+	}
+	_transformObject(object, groupWidth, groupHeight) {
+		const transform = transformObjectOutOfGroup(object.getState(), this.getState(), groupWidth, groupHeight);
+		if (object.classType === "Group") object.transformByState({
+			left: transform.left,
+			top: transform.top
+		});
+		else object.transformByState(transform);
+	}
+	getObjectsByOrder() {
+		const objects = [];
+		this._objects.sort(sortRules);
+		for (const o of this._objects) if (o.visible) objects.push(o);
+		return objects;
+	}
+	getObjects() {
+		return this._objects;
+	}
+	render(ctx, bounds) {
+		ctx.save();
+		const m = this.transform.getMatrix();
+		ctx.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
+		const objects = this.getObjectsByOrder();
+		for (let i = 0; i < objects.length; i++) objects[i].render(ctx, bounds);
+		ctx.restore();
+	}
+	_clear() {
+		this._objects = [];
+	}
+	dispose() {
+		[...this.getObjects()].forEach((o) => {
+			o.dispose();
+		});
+		this._clear();
+		super.dispose();
+	}
+};
+
+//#endregion
+//#region src/drawing-group.ts
+var DrawingGroupObject = class extends Group {
+	constructor(..._args) {
+		super(..._args);
+		_defineProperty(this, "_selfSizeMode", true);
+		_defineProperty(this, "_baseBound", {
+			left: 0,
+			top: 0,
+			width: 0,
+			height: 0
+		});
+		_defineProperty(this, "_outerShadow", void 0);
+		_defineProperty(this, "_glow", void 0);
+	}
+	setOuterShadow(shadow) {
+		this._outerShadow = shadow;
+		this.makeDirty(true);
+	}
+	setGlow(glow) {
+		this._glow = glow;
+		this.makeDirty(true);
+	}
+	/**
+	* Set the baseBound (chOff/chExt in OOXML) for this group.
+	* This defines the coordinate space of children within the group.
+	* When set, the group automatically enters selfSizeMode so its dimensions
+	* are tracked independently of children.
+	*/
+	setBaseBound(bound) {
+		this._baseBound = { ...bound };
+	}
+	/**
+	* Get the baseBound (chOff/chExt in OOXML) for this group.
+	*/
+	getBaseBound() {
+		return { ...this._baseBound };
+	}
+	/**
+	* Override ancestorTransform to use the same render transform as render(),
+	* which uses [m[0], m[1], m[2], m[3], centerX, centerY] from realBound
+	* instead of the standard transform translation.
+	* This ensures children (e.g., Image.isHit) that compose with
+	* parent.ancestorTransform get the correct coordinate space.
+	*/
+	get ancestorTransform() {
+		const { left: realLeft, top: realTop, width: realWidth, height: realHeight } = this.getRealBound();
+		const m = this.transform.getMatrix();
+		const centerX = realLeft + realWidth / 2;
+		const centerY = realTop + realHeight / 2;
+		const renderTransform = new Transform([
+			m[0],
+			m[1],
+			m[2],
+			m[3],
+			centerX,
+			centerY
+		]);
+		const parent = this.getParent();
+		if (this.isInGroup && (parent === null || parent === void 0 ? void 0 : parent.classType) === "Group") return parent.ancestorTransform.multiply(renderTransform);
+		return renderTransform;
+	}
+	render(ctx, bounds) {
+		const { left: realLeft, top: realTop, width: realWidth, height: realHeight } = this.getRealBound();
+		ctx.save();
+		const m = this.transform.getMatrix();
+		const centerX = realLeft + realWidth / 2;
+		const centerY = realTop + realHeight / 2;
+		ctx.transform(m[0], m[1], m[2], m[3], centerX, centerY);
+		const effectFilter = createDrawingEffectFilter(this._glow, void 0);
+		if (effectFilter) ctx.filter = combineDrawingEffectFilter(ctx.filter, effectFilter);
+		if (this._outerShadow) {
+			ctx.shadowColor = this._outerShadow.shadowColor;
+			ctx.shadowBlur = this._outerShadow.shadowBlur;
+			ctx.shadowOffsetX = this._outerShadow.shadowOffsetX;
+			ctx.shadowOffsetY = this._outerShadow.shadowOffsetY;
+		}
+		const objects = this.getObjectsByOrder();
+		for (let i = 0; i < objects.length; i++) objects[i].render(ctx, bounds);
+		ctx.restore();
+	}
+	addObjects(...objects) {
+		for (const object of objects) this.addObject(object);
+	}
+	isHit(coord) {
+		const { left: realLeft, top: realTop, width: realWidth, height: realHeight } = this.getRealBound();
+		const m = this.transform.getMatrix();
+		const centerX = realLeft + realWidth / 2;
+		const centerY = realTop + realHeight / 2;
+		const renderTransform = new Transform([
+			m[0],
+			m[1],
+			m[2],
+			m[3],
+			centerX,
+			centerY
+		]);
+		const parent = this.getParent();
+		const oCoord = (this.isInGroup && (parent === null || parent === void 0 ? void 0 : parent.classType) === "Group" ? parent.ancestorTransform.multiply(renderTransform) : renderTransform).invert().applyPoint(coord);
+		const halfWidth = realWidth / 2;
+		const halfHeight = realHeight / 2;
+		if (oCoord.x < -halfWidth || oCoord.x > halfWidth || oCoord.y < -halfHeight || oCoord.y > halfHeight) return false;
+		const objects = this.getObjectsByOrder();
+		for (let i = 0; i < objects.length; i++) if (objects[i].isHit(coord)) return true;
+		return false;
+	}
+	dispose() {
+		const objects = [...this.getObjects()];
+		const scene = this.getScene();
+		objects.forEach((o) => {
+			o.dispose();
+			scene === null || scene === void 0 || scene.removeObject(o);
+		});
+		this._objects = [];
+		super.dispose();
+		scene === null || scene === void 0 || scene.removeObject(this);
+	}
+};
+
 //#endregion
 //#region src/components/docs/doc-component.ts
 var DocComponent = class extends RenderComponent {
@@ -28151,7 +28653,9 @@ var FontAndBaseLine = class extends docExtension {
 		const { ts: textStyle, content, fontStyle, bBox } = glyph;
 		const { spanPointWithFont = Vector2.create(0, 0) } = this.extensionOffset;
 		if (content == null) return;
-		if (ctx.fontKerning != null) ctx.fontKerning = (fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontKerning) ?? "auto";
+		const currentKerning = ctx.fontKerning;
+		const fontKerning = (fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.fontKerning) ?? "auto";
+		if (currentKerning != null && currentKerning !== fontKerning) ctx.fontKerning = fontKerning;
 		if (!textStyle) {
 			this._fillText(ctx, glyph, spanPointWithFont);
 			return;
@@ -28780,22 +29284,6 @@ function getVisibleContinuousLineRange(lines, viewportTop, viewportBottom, flowT
 		end: low
 	};
 }
-function resolveHeaderFooterFieldGlyph(glyph, startIndex, endIndex, customRanges, pageNumber, pageCount) {
-	var _fieldRange$propertie;
-	if (!glyph.content || glyph.raw === DataStreamTreeTokenType.CUSTOM_RANGE_START || glyph.raw === DataStreamTreeTokenType.CUSTOM_RANGE_END) return glyph;
-	const fieldRange = customRanges.find((customRange) => {
-		var _customRange$properti;
-		return customRange.startIndex <= startIndex && customRange.endIndex >= endIndex && typeof ((_customRange$properti = customRange.properties) === null || _customRange$properti === void 0 ? void 0 : _customRange$properti.fieldType) === "string";
-	});
-	const fieldType = fieldRange === null || fieldRange === void 0 || (_fieldRange$propertie = fieldRange.properties) === null || _fieldRange$propertie === void 0 || (_fieldRange$propertie = _fieldRange$propertie.fieldType) === null || _fieldRange$propertie === void 0 ? void 0 : _fieldRange$propertie.toUpperCase();
-	if (!fieldRange || fieldType !== "PAGE" && fieldType !== "NUMPAGES") return glyph;
-	let content = "";
-	if (startIndex === fieldRange.startIndex + 1) content = String(fieldType === "PAGE" ? pageNumber : pageCount);
-	return content === glyph.content ? glyph : {
-		...glyph,
-		content
-	};
-}
 function resolveHeaderFooterFieldGlyphGroup(divide, context) {
 	var _context$viewModel;
 	const { glyphGroup } = divide;
@@ -28929,8 +29417,21 @@ var Documents = class Documents extends DocComponent {
 		return this.getScene().getEngine();
 	}
 	isHit(coord) {
+		if (super.isHit(coord)) {
+			var _this$getScene;
+			const drawingHit = (_this$getScene = this.getScene()) === null || _this$getScene === void 0 ? void 0 : _this$getScene.getAllObjectsByOrderForPick().some((object) => (object.isDrawingObject || object instanceof DrawingGroupObject) && !object.isInGroup && object.visible && object.evented && object.isHit(coord));
+			const skeleton = this.getSkeleton();
+			if (drawingHit && skeleton) {
+				const node = skeleton.findNodeByCoord(this.getInverseCoord(coord), this.pageLayoutType, this.pageMarginLeft, this.pageMarginTop);
+				if (node === null || node === void 0 ? void 0 : node.isInsideGlyph) return true;
+				return this._isHitTable(coord);
+			}
+			return true;
+		}
+		return this._isHitTable(coord);
+	}
+	_isHitTable(coord) {
 		var _this$getSkeleton;
-		if (super.isHit(coord)) return true;
 		const skeletonData = (_this$getSkeleton = this.getSkeleton()) === null || _this$getSkeleton === void 0 ? void 0 : _this$getSkeleton.getSkeletonData();
 		if (!skeletonData) return false;
 		const localCoord = this.getInverseCoord(coord);
@@ -29023,7 +29524,7 @@ var Documents = class Documents extends DocComponent {
 				this._drawTable(ctx, page, skeTables, extensions, backgroundExtension, preTextBackgroundExtensions, glyphExtensionsExcludeBackground, alignOffsetNoAngle, centerAngle, vertexAngle, renderConfig, parentScale);
 				ctx.restore();
 			}
-			const headerSkeletonPage = (_skeHeaders$get = skeHeaders.get(headerId)) === null || _skeHeaders$get === void 0 ? void 0 : _skeHeaders$get.get(pageWidth);
+			const headerSkeletonPage = (_skeHeaders$get = skeHeaders.get(headerId)) === null || _skeHeaders$get === void 0 ? void 0 : _skeHeaders$get.get(page.headerLayoutKey ?? pageWidth);
 			const headerAlignOffsetNoAngle = Vector2.create(horizontalOffsetNoAngle, (headerSkeletonPage === null || headerSkeletonPage === void 0 ? void 0 : headerSkeletonPage.marginTop) ?? 0);
 			if (headerSkeletonPage) this._drawHeaderFooter(headerSkeletonPage, ctx, extensions, backgroundExtension, preTextBackgroundExtensions, glyphExtensionsExcludeBackground, headerAlignOffsetNoAngle, centerAngle, vertexAngle, renderConfig, parentScale, page, true, pages.length, void 0, headerFooterOpacity);
 			ctx.save();
@@ -29037,7 +29538,7 @@ var Documents = class Documents extends DocComponent {
 				var _this$getSkeleton6;
 				this._drawHeaderFooter(note.page, ctx, extensions, backgroundExtension, preTextBackgroundExtensions, glyphExtensionsExcludeBackground, Vector2.create(horizontalOffsetNoAngle + note.left - page.marginLeft, note.top), centerAngle, vertexAngle, renderConfig, parentScale, page, false, pages.length, "kind" in note ? ((_this$getSkeleton6 = this.getSkeleton()) === null || _this$getSkeleton6 === void 0 || (_this$getSkeleton6 = _this$getSkeleton6.getViewModel().getSnapshot().noteSettings) === null || _this$getSkeleton6 === void 0 || (_this$getSkeleton6 = _this$getSkeleton6[note.noteType ?? "footnote"]) === null || _this$getSkeleton6 === void 0 || (_this$getSkeleton6 = _this$getSkeleton6[note.kind]) === null || _this$getSkeleton6 === void 0 ? void 0 : _this$getSkeleton6.customRanges) ?? [] : void 0);
 			}
-			const footerSkeletonPage = (_skeFooters$get = skeFooters.get(footerId)) === null || _skeFooters$get === void 0 ? void 0 : _skeFooters$get.get(pageWidth);
+			const footerSkeletonPage = (_skeFooters$get = skeFooters.get(footerId)) === null || _skeFooters$get === void 0 ? void 0 : _skeFooters$get.get(page.footerLayoutKey ?? pageWidth);
 			if (footerSkeletonPage) {
 				const footerAlignOffsetNoAngle = Vector2.create(horizontalOffsetNoAngle, page.pageHeight - (footerSkeletonPage === null || footerSkeletonPage === void 0 ? void 0 : footerSkeletonPage.height) - footerSkeletonPage.marginBottom);
 				this._drawHeaderFooter(footerSkeletonPage, ctx, extensions, backgroundExtension, preTextBackgroundExtensions, glyphExtensionsExcludeBackground, footerAlignOffsetNoAngle, centerAngle, vertexAngle, renderConfig, parentScale, page, false, pages.length, void 0, headerFooterOpacity);
@@ -29641,7 +30142,7 @@ var Documents = class Documents extends DocComponent {
 		const skeleton = this.getSkeleton();
 		const viewModel = typeof (skeleton === null || skeleton === void 0 ? void 0 : skeleton.getViewModel) === "function" ? skeleton.getViewModel().getSelfOrHeaderFooterViewModel(page.segmentId) : void 0;
 		const fieldContext = {
-			customRanges: customRangesOverride ?? (viewModel === null || viewModel === void 0 || (_viewModel$getBody = viewModel.getBody()) === null || _viewModel$getBody === void 0 ? void 0 : _viewModel$getBody.customRanges) ?? [],
+			customRanges: page.fieldsResolved ? [] : customRangesOverride ?? (viewModel === null || viewModel === void 0 || (_viewModel$getBody = viewModel.getBody()) === null || _viewModel$getBody === void 0 ? void 0 : _viewModel$getBody.customRanges) ?? [],
 			pageNumber: parentPage.pageNumber,
 			pageCount,
 			viewModel
@@ -34238,290 +34739,6 @@ var CustomObject = class extends BaseObject {
 	}
 };
 
-//#endregion
-//#region src/group.ts
-var Group = class extends BaseObject {
-	constructor(key, ...objects) {
-		super(key);
-		_defineProperty(this, "_objects", []);
-		_defineProperty(this, "_selfSizeMode", false);
-		this.addObjects(...objects);
-	}
-	get classType() {
-		return "Group";
-	}
-	set cursor(val) {
-		this.setCursor(val);
-	}
-	getState() {
-		if (this._selfSizeMode) return super.getState();
-		return getGroupState(this.left, this.top, this._objects.map((o) => o.getState()));
-	}
-	get width() {
-		if (this._selfSizeMode) return super.width;
-		return this.getState().width || 0;
-	}
-	get height() {
-		if (this._selfSizeMode) return super.height;
-		return this.getState().height || 0;
-	}
-	set width(val) {
-		if (this._selfSizeMode) {
-			super.width = val;
-			return;
-		}
-		const numDelta = val - this.width;
-		this._objects.forEach((o) => {
-			o.resize(o.width + numDelta);
-		});
-	}
-	set height(val) {
-		if (this._selfSizeMode) {
-			super.height = val;
-			return;
-		}
-		const numDelta = val - this.height;
-		this._objects.forEach((o) => {
-			o.resize(void 0, o.height + numDelta);
-		});
-	}
-	get maxZIndex() {
-		let maxZIndex = 0;
-		for (const object of this._objects) maxZIndex = Math.max(maxZIndex, object.zIndex);
-		return maxZIndex;
-	}
-	openSelfSizeMode() {
-		this._selfSizeMode = true;
-	}
-	closeSelfSizeMode() {
-		this._selfSizeMode = false;
-	}
-	reCalculateObjects() {
-		if (this._selfSizeMode) return;
-		const { left = 0, top = 0 } = this.getState();
-		for (const object of this._objects) object.transformByState({
-			left: object.left - left,
-			top: object.top - top
-		});
-		this.transformByState({
-			left,
-			top
-		});
-	}
-	addObjects(...objects) {
-		for (const object of objects) this.addObject(object);
-	}
-	addObject(o) {
-		let object = o;
-		if (isString(o)) {
-			const scene = this.getScene();
-			object = scene === null || scene === void 0 ? void 0 : scene.getObject(o);
-			if (!object) return;
-			object.parent = this;
-			object.isInGroup = true;
-			object.groupKey = this.oKey;
-			this._objects.push(object);
-		} else {
-			o.parent = this;
-			o.isInGroup = true;
-			o.groupKey = this.oKey;
-			this._objects.push(o);
-		}
-	}
-	removeObject(object) {
-		const objects = this.getObjects();
-		const objectsLength = objects.length;
-		if (isString(object)) for (let i = 0; i < objectsLength; i++) {
-			const o = objects[i];
-			if (o.oKey === object) {
-				objects.splice(i, 1);
-				this.parent.removeObject(o);
-				return;
-			}
-		}
-		else for (let i = 0; i < objectsLength; i++) {
-			const o = objects[i];
-			if (o === object) {
-				objects.splice(i, 1);
-				this.parent.removeObject(o);
-				return;
-			}
-		}
-	}
-	removeSelfObjectAndTransform(oKey, width, height, isTransform = false) {
-		const objects = [...this.getObjects()];
-		const objectsLength = objects.length;
-		if (width == null) width = this.width;
-		if (height == null) height = this.height;
-		for (let i = 0; i < objectsLength; i++) {
-			const o = objects[i];
-			if (o.oKey === oKey) {
-				objects.splice(i, 1);
-				isTransform && this._transformObject(o, width, height);
-				o.parent = this.parent;
-				o.groupKey = void 0;
-				o.isInGroup = false;
-				this._objects = objects;
-				return;
-			}
-		}
-	}
-	_transformObject(object, groupWidth, groupHeight) {
-		const transform = transformObjectOutOfGroup(object.getState(), this.getState(), groupWidth, groupHeight);
-		if (object.classType === "Group") object.transformByState({
-			left: transform.left,
-			top: transform.top
-		});
-		else object.transformByState(transform);
-	}
-	getObjectsByOrder() {
-		const objects = [];
-		this._objects.sort(sortRules);
-		for (const o of this._objects) if (o.visible) objects.push(o);
-		return objects;
-	}
-	getObjects() {
-		return this._objects;
-	}
-	render(ctx, bounds) {
-		ctx.save();
-		const m = this.transform.getMatrix();
-		ctx.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
-		const objects = this.getObjectsByOrder();
-		for (let i = 0; i < objects.length; i++) objects[i].render(ctx, bounds);
-		ctx.restore();
-	}
-	_clear() {
-		this._objects = [];
-	}
-	dispose() {
-		[...this.getObjects()].forEach((o) => {
-			o.dispose();
-		});
-		this._clear();
-		super.dispose();
-	}
-};
-
-//#endregion
-//#region src/drawing-group.ts
-var DrawingGroupObject = class extends Group {
-	constructor(..._args) {
-		super(..._args);
-		_defineProperty(this, "_selfSizeMode", true);
-		_defineProperty(this, "_baseBound", {
-			left: 0,
-			top: 0,
-			width: 0,
-			height: 0
-		});
-		_defineProperty(this, "_outerShadow", void 0);
-		_defineProperty(this, "_glow", void 0);
-	}
-	setOuterShadow(shadow) {
-		this._outerShadow = shadow;
-		this.makeDirty(true);
-	}
-	setGlow(glow) {
-		this._glow = glow;
-		this.makeDirty(true);
-	}
-	/**
-	* Set the baseBound (chOff/chExt in OOXML) for this group.
-	* This defines the coordinate space of children within the group.
-	* When set, the group automatically enters selfSizeMode so its dimensions
-	* are tracked independently of children.
-	*/
-	setBaseBound(bound) {
-		this._baseBound = { ...bound };
-	}
-	/**
-	* Get the baseBound (chOff/chExt in OOXML) for this group.
-	*/
-	getBaseBound() {
-		return { ...this._baseBound };
-	}
-	/**
-	* Override ancestorTransform to use the same render transform as render(),
-	* which uses [m[0], m[1], m[2], m[3], centerX, centerY] from realBound
-	* instead of the standard transform translation.
-	* This ensures children (e.g., Image.isHit) that compose with
-	* parent.ancestorTransform get the correct coordinate space.
-	*/
-	get ancestorTransform() {
-		const { left: realLeft, top: realTop, width: realWidth, height: realHeight } = this.getRealBound();
-		const m = this.transform.getMatrix();
-		const centerX = realLeft + realWidth / 2;
-		const centerY = realTop + realHeight / 2;
-		const renderTransform = new Transform([
-			m[0],
-			m[1],
-			m[2],
-			m[3],
-			centerX,
-			centerY
-		]);
-		const parent = this.getParent();
-		if (this.isInGroup && (parent === null || parent === void 0 ? void 0 : parent.classType) === "Group") return parent.ancestorTransform.multiply(renderTransform);
-		return renderTransform;
-	}
-	render(ctx, bounds) {
-		const { left: realLeft, top: realTop, width: realWidth, height: realHeight } = this.getRealBound();
-		ctx.save();
-		const m = this.transform.getMatrix();
-		const centerX = realLeft + realWidth / 2;
-		const centerY = realTop + realHeight / 2;
-		ctx.transform(m[0], m[1], m[2], m[3], centerX, centerY);
-		const effectFilter = createDrawingEffectFilter(this._glow, void 0);
-		if (effectFilter) ctx.filter = combineDrawingEffectFilter(ctx.filter, effectFilter);
-		if (this._outerShadow) {
-			ctx.shadowColor = this._outerShadow.shadowColor;
-			ctx.shadowBlur = this._outerShadow.shadowBlur;
-			ctx.shadowOffsetX = this._outerShadow.shadowOffsetX;
-			ctx.shadowOffsetY = this._outerShadow.shadowOffsetY;
-		}
-		const objects = this.getObjectsByOrder();
-		for (let i = 0; i < objects.length; i++) objects[i].render(ctx, bounds);
-		ctx.restore();
-	}
-	addObjects(...objects) {
-		for (const object of objects) this.addObject(object);
-	}
-	isHit(coord) {
-		const { left: realLeft, top: realTop, width: realWidth, height: realHeight } = this.getRealBound();
-		const m = this.transform.getMatrix();
-		const centerX = realLeft + realWidth / 2;
-		const centerY = realTop + realHeight / 2;
-		const renderTransform = new Transform([
-			m[0],
-			m[1],
-			m[2],
-			m[3],
-			centerX,
-			centerY
-		]);
-		const parent = this.getParent();
-		const oCoord = (this.isInGroup && (parent === null || parent === void 0 ? void 0 : parent.classType) === "Group" ? parent.ancestorTransform.multiply(renderTransform) : renderTransform).invert().applyPoint(coord);
-		const halfWidth = realWidth / 2;
-		const halfHeight = realHeight / 2;
-		if (oCoord.x < -halfWidth || oCoord.x > halfWidth || oCoord.y < -halfHeight || oCoord.y > halfHeight) return false;
-		const objects = this.getObjectsByOrder();
-		for (let i = 0; i < objects.length; i++) if (objects[i].isHit(coord)) return true;
-		return false;
-	}
-	dispose() {
-		const objects = [...this.getObjects()];
-		const scene = this.getScene();
-		objects.forEach((o) => {
-			o.dispose();
-			scene === null || scene === void 0 || scene.removeObject(o);
-		});
-		this._objects = [];
-		super.dispose();
-		scene === null || scene === void 0 || scene.removeObject(this);
-	}
-};
-
 //#endregion
 //#region src/floating/util.ts
 /**
@@ -35364,7 +35581,7 @@ Engine = __decorate([__decorateParam(2, ICanvasColorService)], Engine);
 //#endregion
 //#region package.json
 var name = "@univerjs/engine-render";
-var version = "1.0.3";
+var version = "1.1.0";
 
 //#endregion
 //#region src/config/config.ts
@@ -40035,6 +40252,7 @@ var DocumentLayoutSession = class extends Disposable {
 		_defineProperty(this, "_viewModel", void 0);
 		_defineProperty(this, "_skeleton", void 0);
 		_defineProperty(this, "_lastPublishedPageCount", 0);
+		_defineProperty(this, "_paginationRevision", 0);
 		_defineProperty(this, "_layoutReason", "initial");
 		_defineProperty(this, "_didPublishEditAnchor", false);
 		_defineProperty(this, "_continuousPageSnapshot", null);
@@ -40050,6 +40268,7 @@ var DocumentLayoutSession = class extends Disposable {
 		var _options$invalidation;
 		this._lastPublishedPageCount = 0;
 		this._layoutReason = (options === null || options === void 0 ? void 0 : options.reason) ?? "initial";
+		this._paginationRevision = 0;
 		this._didPublishEditAnchor = false;
 		this._publishedHeaderPages.clear();
 		this._publishedFooterPages.clear();
@@ -40130,6 +40349,11 @@ var DocumentLayoutSession = class extends Disposable {
 	}
 	_collectPublications(initialProgress) {
 		let progress = initialProgress;
+		if ((progress.paginationRevision ?? 0) !== this._paginationRevision) {
+			this._paginationRevision = progress.paginationRevision ?? 0;
+			this._lastPublishedPageCount = 0;
+			this._didPublishEditAnchor = false;
+		}
 		if (!progress.didPublish) return {
 			progress,
 			publication: null
@@ -40243,7 +40467,8 @@ var DocumentLayoutSession = class extends Disposable {
 			})))]) : null,
 			drawingAnchor: complete ? [...skeletonData.drawingAnchor ?? []].map(([segmentId, anchors]) => [segmentId, [...anchors].map(([paragraphIndex, anchor]) => [paragraphIndex, {
 				paragraphIndex: anchor.paragraphIndex,
-				top: anchor.top
+				top: anchor.top,
+				...anchor.left == null ? {} : { left: anchor.left }
 			}])]) : null
 		};
 	}