@stll/folio-core 0.25.2 → 0.25.4

package/dist/layout-painter/renderParagraph.js

@@ -2,6 +2,7 @@ import { ommlToMathml } from "../docx/mathToMathml.js";
 import { parseXmlDocument } from "../docx/xmlParser.js";
 import { evaluateFieldInstruction } from "../fields/evaluateField.js";
 import { hasComplexScriptFormatting, resolveComplexScriptFormatting } from "../layout-engine/measure/complexScriptFormatting.js";
+import { getHyperlinkInstanceIndex } from "../layout-engine/measure/hyperlinkInstance.js";
 import { getListMarkerInlineWidth, getListMarkerVisualOffset, resolveListMarkerFont } from "../layout-engine/measure/listMarkerWidth.js";
 import { DOCX_SCRIPT_FONT_SCALE } from "../layout-engine/measure/measureHelpers.js";
 import { FONT_KERNING_MODE, countCompressibleSpaces, getFontKerningMode, getRunFontKerningMode, toPaintedText } from "../layout-engine/measure/textMeasurementPolicy.js";
@@ -10,7 +11,7 @@ import { calculateTabWidth } from "../prosemirror/utils/tabCalculator.js";
 import { AUTHOR_COLORS, getAuthorColorIdx } from "../utils/authorColors.js";
 import { resolveFontFamily } from "../utils/fontResolver.js";
 import "../utils/fontWeights.js";
-import { isRtlParagraph } from "../utils/paragraphBaseDirection.js";
+import { resolvePhysicalParagraphInlineLayout } from "../utils/paragraphInlineLayout.js";
 import { inlineImageBoundingBox, parseRotationDegrees, rotatedBoundingBox } from "../utils/rotationBoundingBox.js";
 import { applySanitizedImageSrc } from "../utils/sanitizeImageSrc.js";
 import { SCRIPT_CLASS, hasCjk, hasComplexScript, segmentByScript } from "../utils/scriptSegments.js";
@@ -49,6 +50,9 @@ function isTextRun(run) {
 	return run.kind === "text";
 }
 function hyperlinksMatch(left, right) {
+	const leftInstanceIndex = getHyperlinkInstanceIndex(left);
+	const rightInstanceIndex = getHyperlinkInstanceIndex(right);
+	if (leftInstanceIndex !== void 0 || rightInstanceIndex !== void 0) return leftInstanceIndex === rightInstanceIndex;
 	return left.href === right.href && left.tooltip === right.tooltip && left.noDefaultStyle === right.noDefaultStyle;
 }
 function collectLeftToRightDisplayedUrlHyperlinks(runs) {
@@ -1097,7 +1101,7 @@ function renderLine(block, line, alignment, doc, options) {
 		return runEl;
 	};
 	const onlyRun = runsForLine.length === 1 ? runsForLine[0] : void 0;
-	if (onlyRun && isMathRun(onlyRun) && onlyRun.display === "block" && block.attrs?.alignment !== "right") lineEl.style.textAlign = "center";
+	if (onlyRun && isMathRun(onlyRun) && onlyRun.display === "block" && (options?.explicitAlignment ?? resolvePhysicalParagraphInlineLayout(block).explicitAlignment) !== "right") lineEl.style.textAlign = "center";
 	if (runsForLine.length === 1 && isImageRun(runsForLine[0])) {
 		lineEl.style.display = "flex";
 		lineEl.style.alignItems = "center";
@@ -1342,26 +1346,15 @@ function renderParagraphFragment(fragment, block, measure, context, options = {}
 	if (fragment.continuesFromPrev) fragmentEl.dataset["continuesFromPrev"] = "true";
 	if (fragment.continuesOnNext) fragmentEl.dataset["continuesOnNext"] = "true";
 	const lines = measure.lines.slice(fragment.fromLine, fragment.toLine);
-	const alignment = block.attrs?.alignment;
+	const inlineLayout = resolvePhysicalParagraphInlineLayout(block);
+	const { alignment, indentLeft, indentRight, isRtl } = inlineLayout;
 	if (block.attrs?.styleId) fragmentEl.dataset["styleId"] = block.attrs.styleId;
-	const isRtl = isRtlParagraph(block);
 	if (isRtl) fragmentEl.dir = "rtl";
-	if (alignment) if (alignment === "center") fragmentEl.style.textAlign = "center";
-	else if (alignment === "right") fragmentEl.style.textAlign = "right";
-	else if (alignment === "left") fragmentEl.style.textAlign = "left";
-	else fragmentEl.style.textAlign = isRtl ? "right" : "left";
-	else if (isRtl) fragmentEl.style.textAlign = "right";
-	const effectiveAlignment = alignment ?? (isRtl ? "right" : void 0);
+	let fragmentAlignment = alignment;
+	if (alignment === "justify") fragmentAlignment = isRtl ? "right" : "left";
+	fragmentEl.style.textAlign = fragmentAlignment;
+	const effectiveAlignment = alignment;
 	const indent = block.attrs?.indent;
-	let indentLeft = 0;
-	let indentRight = 0;
-	if (indent) if (isRtl) {
-		if (indent.left !== void 0) indentRight = indent.left;
-		if (indent.right !== void 0) indentLeft = indent.right;
-	} else {
-		if (indent.left !== void 0) indentLeft = indent.left;
-		if (indent.right !== void 0) indentRight = indent.right;
-	}
 	const borders = block.attrs?.borders;
 	if (borders) {
 		const borderStyleToCss = (style) => {
@@ -1448,6 +1441,7 @@ function renderParagraphFragment(fragment, block, measure, context, options = {}
 			tabLeftIndentPx: indent?.left ?? 0,
 			firstLineIndentPx: isFirstLine ? firstLineIndentPx : 0,
 			isRtl,
+			...inlineLayout.explicitAlignment === void 0 ? {} : { explicitAlignment: inlineLayout.explicitAlignment },
 			contentWidthPx: fragment.width,
 			context,
 			floatingMargins: {
@@ -1460,9 +1454,10 @@ function renderParagraphFragment(fragment, block, measure, context, options = {}
 		});
 		const isFlexLine = lineEl.dataset["flexLine"] === "true";
 		const lineMarginLeft = Math.min(indentLeft, 0) + lineLeftOffset;
+		const lineMarginRight = Math.min(indentRight, 0) + lineRightOffset;
 		if (lineMarginLeft !== 0 || lineRightOffset > 0 || indentLeft < 0 || indentRight < 0) {
 			lineEl.style.marginLeft = `${lineMarginLeft}px`;
-			if (lineRightOffset > 0) lineEl.style.marginRight = `${lineRightOffset}px`;
+			if (lineMarginRight !== 0) lineEl.style.marginRight = `${lineMarginRight}px`;
 			const constrainedWidth = lineAvailableWidth - lineLeftOffset - lineRightOffset;
 			if (constrainedWidth > 0) lineEl.style.width = `${constrainedWidth}px`;
 		}
@@ -1482,27 +1477,33 @@ function renderParagraphFragment(fragment, block, measure, context, options = {}
 		if (isFirstLine && block.attrs?.listMarker && !block.attrs.listMarkerHidden) {
 			const hanging = indent?.hanging ?? 0;
 			const firstLine = indent?.firstLine ?? 0;
-			const markerStart = hanging > 0 ? indentLeft - hanging : indentLeft + firstLine;
-			lineEl.style.paddingLeft = `${Math.max(0, markerStart)}px`;
+			const markerPhysicalStart = isRtl ? "right" : "left";
+			const markerIndent = markerPhysicalStart === "right" ? indentRight : indentLeft;
+			const markerStart = hanging > 0 ? markerIndent - hanging : markerIndent + firstLine;
+			const logicalMarkerVisualOffset = getListMarkerVisualOffset(block);
+			if (markerPhysicalStart === "right") lineEl.style.paddingRight = `${Math.max(0, markerStart)}px`;
+			else lineEl.style.paddingLeft = `${Math.max(0, markerStart)}px`;
 			lineEl.style.textIndent = "0";
-			const marker = renderListMarker(block.attrs.listMarker, getListMarkerInlineWidth(block), getListMarkerVisualOffset(block), doc, resolveListMarkerFont(block), block.attrs.listMarkerRevision, block.attrs.listMarkerSecondSlotOffsetTwips);
-			const markerMarginLeft = markerStart - Math.min(indentLeft, 0);
-			if (markerMarginLeft < 0) marker.style.marginLeft = `${markerMarginLeft}px`;
+			const marker = renderListMarker({
+				marker: block.attrs.listMarker,
+				inlineWidth: getListMarkerInlineWidth(block),
+				visualOffset: markerPhysicalStart === "right" ? -logicalMarkerVisualOffset : logicalMarkerVisualOffset,
+				doc,
+				formatting: resolveListMarkerFont(block),
+				...block.attrs.listMarkerRevision === void 0 ? {} : { revision: block.attrs.listMarkerRevision },
+				...block.attrs.listMarkerSecondSlotOffsetTwips === void 0 ? {} : { secondSlotOffsetTwips: block.attrs.listMarkerSecondSlotOffsetTwips },
+				physicalStart: markerPhysicalStart
+			});
+			const markerMarginLeft = markerStart - (markerPhysicalStart === "right" ? Math.min(indentRight, 0) : Math.min(indentLeft, 0));
+			if (markerMarginLeft < 0) if (markerPhysicalStart === "right") marker.style.marginRight = `${markerMarginLeft}px`;
+			else marker.style.marginLeft = `${markerMarginLeft}px`;
 			lineEl.prepend(marker);
 		}
 		fragmentEl.append(lineEl);
 	}
 	return fragmentEl;
 }
-/**
-* Render a list marker element as an inline-block at the start of the first
-* body line. `inlineWidth` (from `getListMarkerInlineWidth`) sizes the marker
-* so the body text aligns at the next tab stop per ECMA-376 §17.9.25 —
-* this honours `w:suff` (`tab` / `space` / `nothing`) and the document's
-* tab grid. Long markers like "1.1.1." therefore grow to the next stop
-* instead of butting against the body text.
-*/
-function renderListMarker(marker, inlineWidth, visualOffset, doc, formatting, revision, secondSlotOffsetTwips) {
+function renderListMarker({ marker, inlineWidth, visualOffset, doc, formatting, revision, secondSlotOffsetTwips, physicalStart }) {
 	const span = doc.createElement("span");
 	span.className = "layout-list-marker";
 	span.style.display = "inline-block";
@@ -1511,8 +1512,8 @@ function renderListMarker(marker, inlineWidth, visualOffset, doc, formatting, re
 	if (formatting.bold !== void 0) span.style.fontWeight = formatting.bold ? "700" : "normal";
 	if (formatting.italic !== void 0) span.style.fontStyle = formatting.italic ? "italic" : "normal";
 	if (formatting.rtl !== void 0) span.dir = formatting.rtl ? "rtl" : "ltr";
-	span.style.textAlign = "left";
-	span.style.textAlignLast = "left";
+	span.style.textAlign = physicalStart;
+	span.style.textAlignLast = physicalStart;
 	span.style.boxSizing = "border-box";
 	span.style.width = `${inlineWidth}px`;
 	if (visualOffset !== 0) span.style.transform = `translateX(${visualOffset}px)`;
@@ -1546,7 +1547,8 @@ function renderListMarker(marker, inlineWidth, visualOffset, doc, formatting, re
 		secondSlot.style.display = "inline-block";
 		span.style.position = "relative";
 		secondSlot.style.position = "absolute";
-		secondSlot.style.left = `${secondSlotOffsetTwips / 15}px`;
+		if (physicalStart === "right") secondSlot.style.right = `${secondSlotOffsetTwips / 15}px`;
+		else secondSlot.style.left = `${secondSlotOffsetTwips / 15}px`;
 		secondSlot.style.top = "0";
 		span.append(firstSlot, secondSlot);
 		return span;

package/dist/layout-painter/renderTable.js

@@ -1,7 +1,9 @@
 import { measureParagraph } from "../layout-engine/measure/measureParagraph.js";
 import { buildTableCellFloatingZones, getTableCellContentWidth, getTableCellFloatingImages } from "../layout-engine/measure/tableCellFloating.js";
 import { createTableCellFlowState, finishTableCellFlow, placeTableCellBlock } from "../layout-engine/measure/tableCellFlow.js";
-import { getTableRowLeadingWidth, isFloatingImageRun, isFloatingTextBoxBlock, resolveTableCellPadding, tableColumnsArePinned } from "../layout-engine/types.js";
+import { buildTableCellGrid, buildTableCellPlacements, getSourceCellAt } from "../layout-engine/measure/tableCellGrid.js";
+import { resolveTableInlinePlacement } from "../layout-engine/measure/tableInlinePlacement.js";
+import { isFloatingImageRun, isFloatingTextBoxBlock, resolveTableCellPadding, tableColumnsArePinned } from "../layout-engine/types.js";
 import { applySanitizedImageSrc } from "../utils/sanitizeImageSrc.js";
 import { emuToPixels } from "../utils/units.js";
 import { resolveAnchoredImagePosition } from "./anchoredImagePosition.js";
@@ -228,11 +230,14 @@ function renderNestedTable(block, measure, context, doc) {
 	tableEl.style.position = "relative";
 	tableEl.style.width = `${measure.totalWidth}px`;
 	tableEl.style.display = "block";
-	if (block.justification === "center") {
+	const placement = resolveTableInlinePlacement(block);
+	if (placement.alignment === "center") {
 		tableEl.style.marginLeft = "auto";
 		tableEl.style.marginRight = "auto";
-	} else if (block.justification === "right") tableEl.style.marginLeft = "auto";
-	else if (block.indent) tableEl.style.marginLeft = `${block.indent}px`;
+	} else if (placement.alignment === "right") {
+		tableEl.style.marginLeft = "auto";
+		tableEl.style.marginRight = `${placement.offset}px`;
+	} else tableEl.style.marginLeft = `${placement.offset}px`;
 	tableEl.dataset["blockId"] = String(block.id);
 	if (block.pmStart !== void 0) tableEl.dataset["pmStart"] = String(block.pmStart);
 	if (block.pmEnd !== void 0) tableEl.dataset["pmEnd"] = String(block.pmEnd);
@@ -243,9 +248,13 @@ function renderNestedTable(block, measure, context, doc) {
 		yPos += i_item.height;
 	}
 	rowYPositions.push(yPos);
-	const spanningCells = /* @__PURE__ */ new Map();
 	const columnsPinned = tableColumnsArePinned(block);
-	const cellGrid = buildTableCellGrid(block, measure.columnWidths.length);
+	const cellGrid = buildTableCellGrid(block.rows, measure.columnWidths.length);
+	const cellPlacements = buildTableCellPlacements({
+		grid: cellGrid,
+		columnWidths: measure.columnWidths,
+		bidi: block.bidi === true
+	});
 	let y = 0;
 	for (let rowIndex = 0; rowIndex < block.rows.length; rowIndex++) {
 		const row = block.rows[rowIndex];
@@ -264,11 +273,11 @@ function renderNestedTable(block, measure, context, doc) {
 			totalRows: block.rows.length,
 			context,
 			doc,
-			spanningCells,
 			rowYPositions,
 			bidi: block.bidi === true,
 			columnsPinned,
-			cellGrid
+			cellGrid,
+			cellPlacements
 		});
 		tableEl.append(rowEl);
 		y += rowMeasure.height;
@@ -320,13 +329,13 @@ function renderCellDiagonalBorder({ border, direction, cellWidth, cellHeight, do
 	}
 	return line;
 }
-function renderTableCell({ cell, cellMeasure, x, rowHeight, borderFlags, columnsPinned, context, doc, contentClip, pageContentPosition }) {
+function renderTableCell({ cell, cellMeasure, x, width, rowHeight, borderFlags, columnsPinned, context, doc, contentClip, pageContentPosition }) {
 	const cellEl = doc.createElement("div");
 	cellEl.className = TABLE_CLASS_NAMES.cell;
 	cellEl.style.position = "absolute";
 	cellEl.style.left = `${x}px`;
 	cellEl.style.top = "0";
-	cellEl.style.width = `${cellMeasure.width}px`;
+	cellEl.style.width = `${width}px`;
 	cellEl.style.height = `${rowHeight}px`;
 	cellEl.style.overflow = "hidden";
 	cellEl.style.boxSizing = "border-box";
@@ -396,7 +405,7 @@ function renderTableCell({ cell, cellMeasure, x, rowHeight, borderFlags, columns
 	const topLeftToBottomRight = renderCellDiagonalBorder({
 		border: cell.borders?.topLeftToBottomRight,
 		direction: "top-left-to-bottom-right",
-		cellWidth: cellMeasure.width,
+		cellWidth: width,
 		cellHeight: rowHeight,
 		doc
 	});
@@ -404,7 +413,7 @@ function renderTableCell({ cell, cellMeasure, x, rowHeight, borderFlags, columns
 	const topRightToBottomLeft = renderCellDiagonalBorder({
 		border: cell.borders?.topRightToBottomLeft,
 		direction: "top-right-to-bottom-left",
-		cellWidth: cellMeasure.width,
+		cellWidth: width,
 		cellHeight: rowHeight,
 		doc
 	});
@@ -423,52 +432,23 @@ function renderTableCell({ cell, cellMeasure, x, rowHeight, borderFlags, columns
 	}
 	return cellEl;
 }
-const tableCellGridKey = (rowIndex, columnIndex) => `${rowIndex}:${columnIndex}`;
-function buildTableCellGrid(block, columnCount) {
-	const grid = /* @__PURE__ */ new Map();
-	for (let rowIndex = 0; rowIndex < block.rows.length; rowIndex++) {
-		const row = block.rows[rowIndex];
-		if (!row) continue;
-		let columnIndex = 0;
-		for (const cell of row.cells) {
-			while (grid.has(tableCellGridKey(rowIndex, columnIndex))) columnIndex += 1;
-			const colSpan = cell.colSpan ?? 1;
-			const rowSpan = cell.rowSpan ?? 1;
-			const rowEnd = Math.min(block.rows.length, rowIndex + rowSpan);
-			const columnEnd = Math.min(columnCount, columnIndex + colSpan);
-			for (let gridRow = rowIndex; gridRow < rowEnd; gridRow++) for (let gridColumn = columnIndex; gridColumn < columnEnd; gridColumn++) grid.set(tableCellGridKey(gridRow, gridColumn), cell);
-			columnIndex += colSpan;
-		}
-	}
-	return grid;
-}
 const hasVisibleBorder = (border) => border !== void 0 && border.style !== "none" && border.style !== "nil";
-function renderTableRow({ row, rowMeasure, rowIndex, y, columnWidths, totalRows, context, doc, spanningCells, rowYPositions, isFirstRowInFragment, bidi = false, columnsPinned = false, cellGrid, contentClip, pageContentPosition }) {
+function renderTableRow({ row, rowMeasure, rowIndex, y, columnWidths, totalRows, context, doc, rowYPositions, isFirstRowInFragment, bidi = false, columnsPinned = false, cellGrid, cellPlacements, contentClip, pageContentPosition }) {
 	const rowEl = doc.createElement("div");
 	rowEl.className = TABLE_CLASS_NAMES.row;
-	const tableWidth = bidi ? columnWidths.reduce((sum, columnWidth) => sum + columnWidth, 0) : 0;
 	rowEl.style.position = "absolute";
 	rowEl.style.left = "0";
 	rowEl.style.top = `${y}px`;
 	rowEl.style.width = "100%";
 	rowEl.style.height = `${rowMeasure.height}px`;
 	rowEl.dataset["rowIndex"] = String(rowIndex);
-	const occupiedColumns = /* @__PURE__ */ new Set();
-	if (spanningCells) {
-		for (const [, spanCell] of spanningCells) if (spanCell.startRow < rowIndex && spanCell.startRow + spanCell.rowSpan > rowIndex) for (let c = 0; c < spanCell.colSpan; c++) occupiedColumns.add(spanCell.columnIndex + c);
-	}
-	const gridBefore = row.gridBefore ?? 0;
-	let x = getTableRowLeadingWidth(row, columnWidths);
-	let columnIndex = gridBefore;
-	while (occupiedColumns.has(columnIndex)) {
-		x += columnWidths[columnIndex] ?? 0;
-		columnIndex++;
-	}
 	for (let cellIndex = 0; cellIndex < row.cells.length; cellIndex++) {
 		const cell = row.cells[cellIndex];
 		const cellMeasure = rowMeasure.cells[cellIndex];
 		if (!cell || !cellMeasure) continue;
-		const colSpan = cell.colSpan ?? 1;
+		const placement = cellPlacements.get(cell);
+		if (!placement) continue;
+		const { sourceColumn: columnIndex, columnSpan: colSpan, left: cellLeft, width } = placement;
 		const rowSpan = cell.rowSpan ?? 1;
 		let cellHeight = rowMeasure.height;
 		if (rowSpan > 1 && rowYPositions) {
@@ -476,24 +456,21 @@ function renderTableRow({ row, rowMeasure, rowIndex, y, columnWidths, totalRows,
 			for (let r = rowIndex; r < rowIndex + rowSpan && r < rowYPositions.length - 1; r++) cellHeight += (rowYPositions[r + 1] ?? 0) - (rowYPositions[r] ?? 0);
 			if (cellHeight === 0) cellHeight = rowMeasure.height * rowSpan;
 		}
-		let cellWidth = 0;
-		for (let c = 0; c < colSpan && columnIndex + c < columnWidths.length; c++) cellWidth += columnWidths[columnIndex + c] ?? 0;
-		const cellLeft = bidi ? tableWidth - x - cellWidth : x;
 		const isFirstRow = rowIndex === 0 || isFirstRowInFragment === true;
 		const isLastRow = rowIndex + rowSpan >= totalRows;
 		const atLogicalStart = columnIndex === 0;
 		const atLogicalEnd = columnIndex + colSpan >= columnWidths.length;
 		const isFirstCol = bidi ? atLogicalEnd : atLogicalStart;
 		const isLastCol = bidi ? atLogicalStart : atLogicalEnd;
-		const aboveCell = cellGrid?.get(tableCellGridKey(rowIndex - 1, columnIndex));
-		const leftNeighborColumn = bidi ? columnIndex + colSpan : columnIndex - 1;
-		const leftCell = cellGrid?.get(tableCellGridKey(rowIndex, leftNeighborColumn));
+		const aboveCell = getSourceCellAt(cellGrid, rowIndex - 1, columnIndex);
+		const leftCell = getSourceCellAt(cellGrid, rowIndex, bidi ? columnIndex + colSpan : columnIndex - 1);
 		const drawTop = isFirstRow || !hasVisibleBorder(aboveCell?.borders?.bottom);
 		const drawLeft = isFirstCol || !hasVisibleBorder(leftCell?.borders?.right);
 		const cellEl = renderTableCell({
 			cell,
 			cellMeasure,
 			x: cellLeft,
+			width,
 			rowHeight: cellHeight,
 			borderFlags: {
 				drawTop,
@@ -515,25 +492,6 @@ function renderTableRow({ row, rowMeasure, rowIndex, y, columnWidths, totalRows,
 		cellEl.dataset["columnIndex"] = String(columnIndex);
 		if (rowSpan > 1) cellEl.dataset["rowSpan"] = String(rowSpan);
 		rowEl.append(cellEl);
-		if (rowSpan > 1 && spanningCells) {
-			const key = `${rowIndex}-${columnIndex}`;
-			spanningCells.set(key, {
-				cell,
-				cellMeasure,
-				columnIndex,
-				startRow: rowIndex,
-				rowSpan,
-				colSpan,
-				x: cellLeft,
-				totalHeight: cellHeight
-			});
-		}
-		x += cellWidth;
-		columnIndex += colSpan;
-		while (occupiedColumns.has(columnIndex)) {
-			x += columnWidths[columnIndex] ?? 0;
-			columnIndex++;
-		}
 	}
 	return rowEl;
 }
@@ -592,9 +550,13 @@ function renderTableFragment(fragment, block, measure, context, options = {}) {
 		yPos += i_item.height;
 	}
 	rowYPositions.push(yPos);
-	const spanningCells = /* @__PURE__ */ new Map();
 	const columnsPinned = tableColumnsArePinned(block);
-	const cellGrid = buildTableCellGrid(block, measure.columnWidths.length);
+	const cellGrid = buildTableCellGrid(block.rows, measure.columnWidths.length);
+	const cellPlacements = buildTableCellPlacements({
+		grid: cellGrid,
+		columnWidths: measure.columnWidths,
+		bidi: block.bidi === true
+	});
 	const headerRowCount = fragment.headerRowCount ?? 0;
 	let y = 0;
 	if (headerRowCount > 0 && fragment.continuesFromPrev) for (let hdrIdx = 0; hdrIdx < headerRowCount; hdrIdx++) {
@@ -614,12 +576,12 @@ function renderTableFragment(fragment, block, measure, context, options = {}) {
 			totalRows: block.rows.length,
 			context,
 			doc,
-			spanningCells,
 			rowYPositions,
 			isFirstRowInFragment: hdrIdx === 0,
 			bidi: block.bidi === true,
 			columnsPinned,
 			cellGrid,
+			cellPlacements,
 			...tablePageContentPosition ? { pageContentPosition: {
 				...tablePageContentPosition,
 				y: tablePageContentPosition.y + y
@@ -667,12 +629,12 @@ function renderTableFragment(fragment, block, measure, context, options = {}) {
 			totalRows: block.rows.length,
 			context,
 			doc,
-			spanningCells,
 			rowYPositions,
 			isFirstRowInFragment,
 			bidi: block.bidi === true,
 			columnsPinned,
 			cellGrid,
+			cellPlacements,
 			...contentClip ? { contentClip } : {},
 			...tablePageContentPosition ? { pageContentPosition: {
 				...tablePageContentPosition,

package/dist/prosemirror/conversion/toProseDoc.js

@@ -30,6 +30,11 @@ const createTextBoxGroupIdFactory = () => {
 	let index = 0;
 	return () => `${salt}:${index++}`;
 };
+/** Keep imported hyperlink identity unique across every nested conversion scope. */
+const createHyperlinkInstanceIndexAllocator = () => {
+	let index = 0;
+	return () => index++;
+};
 /**
 * Convert a Document to a ProseMirror document
 *
@@ -42,6 +47,11 @@ function toProseDoc(document, options) {
 	const styleResolver = createStyleEngine(options?.styles ?? document.package.styles);
 	const theme = options?.theme ?? document.package.theme ?? null;
 	const nextTextBoxGroupId = createTextBoxGroupIdFactory();
+	const conversionContext = {
+		theme,
+		nextTextBoxGroupId,
+		nextHyperlinkInstanceIndex: createHyperlinkInstanceIndexAllocator()
+	};
 	const convertBodyBlocks = (blocks) => {
 		const out = [];
 		for (const block of blocks) if (block.type === "paragraph") {
@@ -49,10 +59,7 @@ function toProseDoc(document, options) {
 			if (pbPos === "before") out.push(schema.node("pageBreak"));
 			const converted = convertParagraphWithTextBoxes(block, styleResolver, {
 				textBoxGroupId: nextTextBoxGroupId(),
-				context: {
-					theme,
-					nextTextBoxGroupId
-				}
+				context: conversionContext
 			});
 			const firstConverted = converted.at(0);
 			if (pbPos === "before" && converted.length === 1 && firstConverted?.type.name === "paragraph" && firstConverted.content.size === 0 && document.package.settings?.splitPageBreakAndParagraphMark !== true) {
@@ -72,10 +79,7 @@ function toProseDoc(document, options) {
 			}
 			out.push(...converted);
 			if (pbPos === "after") out.push(schema.node("pageBreak"));
-		} else if (block.type === "table") out.push(convertTable(block, styleResolver, {
-			theme,
-			nextTextBoxGroupId
-		}));
+		} else if (block.type === "table") out.push(convertTable(block, styleResolver, conversionContext));
 		else out.push(convertBlockSdt(block, convertBodyBlocks));
 		return out;
 	};
@@ -122,14 +126,13 @@ function convertBlockSdt(blockSdt, convertBlocks) {
 * Resolves style-based text formatting and passes it to runs so that
 * paragraph styles (like Heading1) apply their font size, color, etc.
 */
-function convertParagraph(paragraph, styleResolver, activeCommentIds, extraRunFormatting, tableParagraphOverlay, textBoxAnchors) {
+function convertParagraph(paragraph, styleResolver, nextHyperlinkInstanceIndex, activeCommentIds, extraRunFormatting, tableParagraphOverlay, textBoxAnchors) {
 	const attrs = paragraphFormattingToAttrs(paragraph, styleResolver, tableParagraphOverlay);
 	const isTocParagraph = isTocStyleId(paragraph.formatting?.styleId);
 	const inlineNodes = [];
 	let inlineOffset = 0;
 	let bookmarksArr;
 	let emptyHyperlinks;
-	let hyperlinkIndex = 0;
 	const commentIds = activeCommentIds ?? /* @__PURE__ */ new Set();
 	const emitInlineNodes = (nodes) => {
 		if (nodes.length === 0) return;
@@ -160,7 +163,7 @@ function convertParagraph(paragraph, styleResolver, activeCommentIds, extraRunFo
 		return suppressParagraphMarkFormatting(baseRunFormatting, inheritableParagraphRunFormatting, formatting, paragraphMarkPrecedesStyle);
 	};
 	const emitTrackedChange = (change, markType, moveKind) => {
-		emitInlineNodes(convertTrackedChange(change, markType, getInheritedRunFormatting, styleResolver, moveKind, textBoxAnchors));
+		emitInlineNodes(convertTrackedChange(change, markType, nextHyperlinkInstanceIndex, getInheritedRunFormatting, styleResolver, moveKind, textBoxAnchors));
 	};
 	for (const content of paragraph.content) {
 		if (content.type === "commentRangeStart") commentIds.add(content.id);
@@ -168,12 +171,10 @@ function convertParagraph(paragraph, styleResolver, activeCommentIds, extraRunFo
 		else if (content.type === "commentReference") anchorPointComment(inlineNodes, content.id);
 		else if (content.type === "run") emitInlineNodes(convertRun(content, getInheritedRunFormatting(content.formatting), styleResolver, textBoxAnchors));
 		else if (content.type === "hyperlink") {
-			const currentHyperlinkIndex = hyperlinkIndex;
-			hyperlinkIndex += 1;
 			const linkNodes = convertHyperlink(content, {
 				getInheritedRunFormatting,
 				styleResolver,
-				hyperlinkIndex: currentHyperlinkIndex,
+				hyperlinkIndex: nextHyperlinkInstanceIndex(),
 				textBoxAnchors
 			});
 			if (linkNodes.length === 0) {
@@ -189,7 +190,7 @@ function convertParagraph(paragraph, styleResolver, activeCommentIds, extraRunFo
 			}
 			emitInlineNodes(linkNodes);
 		} else if (content.type === "simpleField" || content.type === "complexField") emitInlineNode(convertField(content, getInheritedRunFormatting, styleResolver));
-		else if (content.type === "inlineSdt") emitInlineNode(convertInlineSdt(content, getInheritedRunFormatting, styleResolver, textBoxAnchors));
+		else if (content.type === "inlineSdt") emitInlineNode(convertInlineSdt(content, nextHyperlinkInstanceIndex, getInheritedRunFormatting, styleResolver, textBoxAnchors));
 		else if (content.type === "insertion" || content.type === "moveTo") emitTrackedChange(content, "insertion", content.type === "moveTo" ? "moveTo" : null);
 		else if (content.type === "deletion" || content.type === "moveFrom") emitTrackedChange(content, "deletion", content.type === "moveFrom" ? "moveFrom" : null);
 		else if (content.type === "mathEquation") emitInlineNode(convertMathEquation(content));
@@ -243,13 +244,11 @@ function anchorPointComment(nodes, commentId) {
 * Convert tracked change (insertion or deletion) content to PM nodes with
 * an insertion/deletion mark applied.
 */
-function convertTrackedChange(change, markType, getInheritedRunFormatting, styleResolver, moveKind = null, textBoxAnchors) {
+function convertTrackedChange(change, markType, nextHyperlinkInstanceIndex, getInheritedRunFormatting, styleResolver, moveKind = null, textBoxAnchors) {
 	const nodes = [];
-	let hyperlinkIndex = 0;
 	for (const item of change.content) if (item.type === "run") nodes.push(...convertRun(item, getInheritedRunFormatting(item.formatting), styleResolver, textBoxAnchors));
 	else {
-		const currentHyperlinkIndex = hyperlinkIndex;
-		hyperlinkIndex += 1;
+		const currentHyperlinkIndex = nextHyperlinkInstanceIndex();
 		nodes.push(...convertHyperlink(item, {
 			getInheritedRunFormatting,
 			styleResolver,
@@ -921,7 +920,8 @@ function standaloneTableCellToProseMirror(cell, nodeType) {
 		styleResolver: null,
 		context: {
 			theme: null,
-			nextTextBoxGroupId: createTextBoxGroupIdFactory()
+			nextTextBoxGroupId: createTextBoxGroupIdFactory(),
+			nextHyperlinkInstanceIndex: createHyperlinkInstanceIndexAllocator()
 		},
 		isHeader: nodeType === "tableHeader",
 		gridWidthPercent: void 0,
@@ -973,20 +973,17 @@ function convertMathEquation(math) {
 /**
 * Convert an InlineSdt to a ProseMirror sdt node with inline content.
 */
-function convertInlineSdt(sdt, getInheritedRunFormatting, styleResolver, textBoxAnchors) {
+function convertInlineSdt(sdt, nextHyperlinkInstanceIndex, getInheritedRunFormatting, styleResolver, textBoxAnchors) {
 	const props = sdt.properties;
 	const inlineNodes = [];
-	let hyperlinkIndex = 0;
 	for (const content of sdt.content) if (content.type === "run") {
 		const runNodes = convertRun(content, getInheritedRunFormatting(content.formatting), styleResolver, textBoxAnchors);
 		inlineNodes.push(...runNodes);
 	} else if (content.type === "hyperlink") {
-		const currentHyperlinkIndex = hyperlinkIndex;
-		hyperlinkIndex += 1;
 		const linkNodes = convertHyperlink(content, {
 			getInheritedRunFormatting,
 			styleResolver,
-			hyperlinkIndex: currentHyperlinkIndex,
+			hyperlinkIndex: nextHyperlinkInstanceIndex(),
 			textBoxAnchors
 		});
 		inlineNodes.push(...linkNodes);
@@ -994,12 +991,12 @@ function convertInlineSdt(sdt, getInheritedRunFormatting, styleResolver, textBox
 		const fieldNode = convertField(content, getInheritedRunFormatting, styleResolver);
 		if (fieldNode) inlineNodes.push(fieldNode);
 	} else if (content.type === "inlineSdt") {
-		const nestedSdt = convertInlineSdt(content, getInheritedRunFormatting, styleResolver, textBoxAnchors);
+		const nestedSdt = convertInlineSdt(content, nextHyperlinkInstanceIndex, getInheritedRunFormatting, styleResolver, textBoxAnchors);
 		if (nestedSdt) inlineNodes.push(nestedSdt);
-	} else if (content.type === "insertion") inlineNodes.push(...convertTrackedChange(content, "insertion", getInheritedRunFormatting, styleResolver, null, textBoxAnchors));
-	else if (content.type === "deletion") inlineNodes.push(...convertTrackedChange(content, "deletion", getInheritedRunFormatting, styleResolver, null, textBoxAnchors));
-	else if (content.type === "moveTo") inlineNodes.push(...convertTrackedChange(content, "insertion", getInheritedRunFormatting, styleResolver, "moveTo", textBoxAnchors));
-	else if (content.type === "moveFrom") inlineNodes.push(...convertTrackedChange(content, "deletion", getInheritedRunFormatting, styleResolver, "moveFrom", textBoxAnchors));
+	} else if (content.type === "insertion") inlineNodes.push(...convertTrackedChange(content, "insertion", nextHyperlinkInstanceIndex, getInheritedRunFormatting, styleResolver, null, textBoxAnchors));
+	else if (content.type === "deletion") inlineNodes.push(...convertTrackedChange(content, "deletion", nextHyperlinkInstanceIndex, getInheritedRunFormatting, styleResolver, null, textBoxAnchors));
+	else if (content.type === "moveTo") inlineNodes.push(...convertTrackedChange(content, "insertion", nextHyperlinkInstanceIndex, getInheritedRunFormatting, styleResolver, "moveTo", textBoxAnchors));
+	else if (content.type === "moveFrom") inlineNodes.push(...convertTrackedChange(content, "deletion", nextHyperlinkInstanceIndex, getInheritedRunFormatting, styleResolver, "moveFrom", textBoxAnchors));
 	else {
 		const mathNode = convertMathEquation(content);
 		if (mathNode) inlineNodes.push(mathNode);
@@ -1380,7 +1377,7 @@ function convertShape(shape) {
 }
 function convertParagraphWithTextBoxes(block, styleResolver, { textBoxGroupId, context, extraRunFormatting, tableParagraphOverlay }) {
 	const { textBoxes, textBoxAnchors } = extractTextBoxesFromParagraph(block, textBoxGroupId);
-	const pmParagraph = convertParagraph(block, styleResolver, void 0, extraRunFormatting, tableParagraphOverlay, textBoxAnchors);
+	const pmParagraph = convertParagraph(block, styleResolver, context.nextHyperlinkInstanceIndex, void 0, extraRunFormatting, tableParagraphOverlay, textBoxAnchors);
 	const nodes = [];
 	const isEmptyAfterExtraction = textBoxes.length > 0 && !hasContentBesidesTextBoxAnchors(pmParagraph);
 	const keepWrapperParagraph = isEmptyAfterExtraction && hasParagraphBoundaryPayload(block, pmParagraph);
@@ -1639,19 +1636,18 @@ function headerFooterToProseDoc(content, options) {
 	const styleResolver = options?.styles ? createStyleEngine(options.styles) : null;
 	const theme = options?.theme ?? null;
 	const nextTextBoxGroupId = createTextBoxGroupIdFactory();
+	const conversionContext = {
+		theme,
+		nextTextBoxGroupId,
+		nextHyperlinkInstanceIndex: createHyperlinkInstanceIndexAllocator()
+	};
 	const convertBlocks = (blocks) => {
 		const out = [];
 		for (const block of blocks) if (block.type === "paragraph") out.push(...convertParagraphWithTextBoxes(block, styleResolver, {
 			textBoxGroupId: nextTextBoxGroupId(),
-			context: {
-				theme,
-				nextTextBoxGroupId
-			}
-		}));
-		else if (block.type === "table") out.push(convertTable(block, styleResolver, {
-			theme,
-			nextTextBoxGroupId
+			context: conversionContext
 		}));
+		else if (block.type === "table") out.push(convertTable(block, styleResolver, conversionContext));
 		else out.push(convertBlockSdt(block, convertBlocks));
 		return out;
 	};

package/dist/utils/paragraphInlineLayout.d.ts

@@ -0,0 +1,14 @@
+import { ParagraphAttrs, ParagraphBlock } from "../layout-engine/types.js";
+//#region src/utils/paragraphInlineLayout.d.ts
+type ParagraphAlignment = NonNullable<ParagraphAttrs["alignment"]>;
+type PhysicalParagraphInlineLayout = {
+  alignment: ParagraphAlignment;
+  explicitAlignment?: ParagraphAlignment;
+  indentLeft: number;
+  indentRight: number;
+  isRtl: boolean;
+};
+/** Resolve logical OOXML paragraph sides into physical inline geometry. */
+declare const resolvePhysicalParagraphInlineLayout: (block: ParagraphBlock) => PhysicalParagraphInlineLayout;
+//#endregion
+export { PhysicalParagraphInlineLayout, resolvePhysicalParagraphInlineLayout };

package/dist/utils/paragraphInlineLayout.js

@@ -0,0 +1,25 @@
+import { isRtlParagraph } from "./paragraphBaseDirection.js";
+//#region src/utils/paragraphInlineLayout.ts
+const mirrorHorizontalAlignment = (alignment) => {
+	if (alignment === "left") return "right";
+	if (alignment === "right") return "left";
+	return alignment;
+};
+/** Resolve logical OOXML paragraph sides into physical inline geometry. */
+const resolvePhysicalParagraphInlineLayout = (block) => {
+	const attrs = block.attrs;
+	const isRtl = isRtlParagraph(block);
+	const mirrorsHorizontalSides = attrs?.bidi === true;
+	const explicitAlignment = mirrorsHorizontalSides ? mirrorHorizontalAlignment(attrs?.alignment) : attrs?.alignment;
+	const indentLeft = attrs?.indent?.left ?? 0;
+	const indentRight = attrs?.indent?.right ?? 0;
+	return {
+		alignment: explicitAlignment ?? (isRtl ? "right" : "left"),
+		...explicitAlignment === void 0 ? {} : { explicitAlignment },
+		indentLeft: mirrorsHorizontalSides ? indentRight : indentLeft,
+		indentRight: mirrorsHorizontalSides ? indentLeft : indentRight,
+		isRtl
+	};
+};
+//#endregion
+export { resolvePhysicalParagraphInlineLayout };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stll/folio-core",
-  "version": "0.25.2",
+  "version": "0.25.4",
   "description": "Headless, framework-neutral core of folio: the OOXML (.docx) parser, document model, ProseMirror integration, and page-layout engine. No React.",
   "keywords": [
     "document-model",