@portone/docx-editor 0.5.1 → 0.6.1

package/dist/page/kinds/paragraphKind.js

@@ -28,9 +28,11 @@ var paragraphKind = {
     const breaks = pageBreaksIn(node, pos);
     const candidates = [];
     let appliedHeight = 0;
+    const opened = /* @__PURE__ */ new Map();
     dom.querySelectorAll(BREAK_SPACE).forEach((space, index) => {
       const box = space.getBoundingClientRect();
       const found = breaks.at(index);
+      const drawn = box.height / scale;
       if (found) {
         candidates.push({
           at: found.at,
@@ -38,8 +40,9 @@ var paragraphKind = {
           forced: true,
           repeatHeight: 0
         });
+        if (drawn > 0) opened.set(found.at, drawn);
       }
-      appliedHeight += box.height / scale;
+      appliedHeight += drawn;
     });
     return {
       candidates,
@@ -48,6 +51,7 @@ var paragraphKind = {
       // still start a new page, but only after the whole block
       breakAfter: dom.querySelectorAll(PAGE_BREAK_BR).length > candidates.length,
       appliedHeight,
+      opened,
       keepWithNext: toParagraphFormat(node.attrs.format)?.keepNext === true
     };
   },
@@ -59,6 +63,8 @@ var paragraphKind = {
       into.push(
         Decoration.inline(at, at + size, {
           nodeName: "span",
+          // Chrome can enter the enlarged break and insert text outside the document model.
+          contenteditable: "false",
           style: spaceStyle(height),
           [editorAttributes.pageBreakSpace]: `${height}`
         })

package/dist/page/kinds/tableKind.js

@@ -34,7 +34,8 @@ function rowEntries(view, tableNode, tablePos, tableDom, appliedRows, scale) {
       node: row,
       pos,
       top: (rect.top - tableTop) / scale - appliedBefore,
-      height: rect.height / scale
+      height: rect.height / scale,
+      appliedAbove: appliedBefore
     });
   });
   return entries;
@@ -132,6 +133,12 @@ var tableKind = {
         });
       }
     }
+    const opened = /* @__PURE__ */ new Map();
+    rows.forEach((row, index) => {
+      const above = index === 0 ? 0 : rows[index - 1]?.appliedAbove ?? 0;
+      const here = row.appliedAbove - above;
+      if (here > 0) opened.set(row.pos, here);
+    });
     const firstBodyBoundary = candidates.find(
       (candidate) => candidate.offset > repeatHeaderHeight + 0.5
     );
@@ -141,6 +148,7 @@ var tableKind = {
     );
     return {
       candidates,
+      opened,
       // The smallest useful first piece: the headers followed by one body row group
       minFirstPiece: firstBodyBoundary?.offset ?? dom.getBoundingClientRect().height / scale - appliedHeight,
       // A space cannot be opened inside a cell, so a break standing in one is answered after the

package/dist/page/measureBlocks.d.ts

@@ -7,6 +7,8 @@
  * The engine's own marks are taken back off as they are read, so a block already pushed and a
  * break already given its space read as they would with neither applied. A measurement that read
  * them in would add to what is already there, and the layout would creep on every pass.
+ * Every demand source (`page/demands`) is asked about every block as well, after its kind, and the
+ * places it reads have the spaces the engine opened inside the block taken back off the same way.
  * Where there is no layout (in tests) everything is 0, so the result is a single page.
  */
 import type { EditorView } from "prosemirror-view";

package/dist/page/measureBlocks.js

@@ -1,15 +1,15 @@
 // src/page/measureBlocks.ts
 import { editorAttributes } from "../styles/classNames.js";
-import { blockKindFor } from "./blockKinds.js";
-import { blockKindsOf } from "./pageDecorations.js";
+import { visualScaleOf } from "../styles/visualScale.js";
+import {
+  blockKindFor
+} from "./blockKinds.js";
+import { blockKindsOf, demandSourcesOf } from "./pageDecorations.js";
+var NOTHING_OPENED = /* @__PURE__ */ new Map();
 function pixels(value) {
   const parsed = Number.parseFloat(value);
   return Number.isFinite(parsed) ? parsed : 0;
 }
-function visualScale(element) {
-  const scale = pixels(getComputedStyle(element).zoom);
-  return scale > 0 ? scale : 1;
-}
 function appliedPush(element) {
   return pixels(element.getAttribute(editorAttributes.pagePush) ?? "");
 }
@@ -23,16 +23,28 @@ function drawnBlocks(view) {
   });
   return found;
 }
+function naturalOffset(candidates, opened, drawn) {
+  let shift = 0;
+  for (const candidate of candidates) {
+    const space = opened.get(candidate.at);
+    if (space === void 0) continue;
+    const start = candidate.offset + shift;
+    if (drawn < start) break;
+    shift += Math.min(space, drawn - start);
+  }
+  return drawn - shift;
+}
 function measureSheet(view, layer) {
   const sheet = view.dom;
   const sheetRect = sheet.getBoundingClientRect();
   const layerRect = layer.getBoundingClientRect();
   const style = getComputedStyle(sheet);
-  const scale = visualScale(layer);
+  const scale = visualScaleOf(layer);
   const contentTop = pixels(style.paddingTop);
   const contentBottom = pixels(style.paddingBottom);
   const sheetY = (viewportY) => (viewportY - sheetRect.top) / scale;
   const kinds = blockKindsOf(view.state);
+  const sources = demandSourcesOf(view.state);
   const blocks = [];
   let previousBottom = contentTop;
   let applied = 0;
@@ -42,7 +54,7 @@ function measureSheet(view, layer) {
     const above = applied;
     const blockY = (viewportY) => sheetY(viewportY) - above;
     const top = blockY(rect.top);
-    const measured = blockKindFor(kinds, node).measure({
+    const target = {
       view,
       node,
       pos,
@@ -50,7 +62,8 @@ function measureSheet(view, layer) {
       sheetY: blockY,
       top,
       scale
-    });
+    };
+    const measured = blockKindFor(kinds, node).measure(target);
     applied += measured.appliedHeight;
     const bottom = sheetY(rect.bottom) - applied;
     blocks.push({
@@ -61,7 +74,15 @@ function measureSheet(view, layer) {
       breakAfter: measured.breakAfter,
       candidates: measured.candidates,
       minFirstPiece: measured.minFirstPiece,
-      keepWithNext: measured.keepWithNext ?? false
+      keepWithNext: measured.keepWithNext ?? false,
+      demands: sources.flatMap((source) => source.demandsIn(target)).map((demand) => ({
+        ...demand,
+        offset: naturalOffset(
+          measured.candidates,
+          measured.opened ?? NOTHING_OPENED,
+          demand.offset
+        )
+      }))
     });
     previousBottom = bottom;
   }

package/dist/page/pageDecorations.d.ts

@@ -3,13 +3,15 @@
  * own kind draws the cuts inside it as (`page/kinds`).
  *
  * The kinds the editor was built with are held here, so the measurement and the decorations read
- * one registry and a block is measured by the same kind that draws it.
+ * one registry and a block is measured by the same kind that draws it. The demand sources
+ * (`page/demands`) the measurement asks about every block are held beside them.
  * The document model is left untouched, so no trace of any of it is left in the exported XML or
  * in the edit history.
  */
 import { type EditorState, Plugin } from "prosemirror-state";
 import { DecorationSet, type EditorView } from "prosemirror-view";
 import { type BlockKind, type PageCut } from "./blockKinds";
+import { type DemandSource } from "./demands";
 import type { BlockPush } from "./pageLayout";
 /** Everything one measurement has to say about the page (`page/pageLayout`) */
 export interface PageMarksInput {
@@ -25,11 +27,16 @@ export interface PageMarksInput {
 }
 interface PageMarks extends PageMarksInput {
     kinds: readonly BlockKind[];
+    sources: readonly DemandSource[];
     decorations: DecorationSet;
 }
-export declare function pageDecorations(kinds?: readonly BlockKind[]): Plugin<PageMarks>;
+export declare function pageDecorations(kinds?: readonly BlockKind[], sources?: readonly DemandSource[]): Plugin<PageMarks>;
 /** The kinds the editor was built with, which the measurement reads to match them */
 export declare function blockKindsOf(state: EditorState): readonly BlockKind[];
+/** The demand sources the editor was built with, which the measurement asks about every block */
+export declare function demandSourcesOf(state: EditorState): readonly DemandSource[];
+/** The cuts the sheet is drawn with, whose spaces the measurement takes back off a demand's place */
+export declare function pageCutsOf(state: EditorState): readonly PageCut[];
 /** One transaction, or none when the same marks are already applied */
 export declare function setPageMarks(view: EditorView, next: PageMarksInput): void;
 export {};

package/dist/page/pageDecorations.js

@@ -6,6 +6,7 @@ import {
 import { Decoration, DecorationSet } from "prosemirror-view";
 import { editorAttributes } from "../styles/classNames.js";
 import { blockKindFor } from "./blockKinds.js";
+import { DEFAULT_DEMAND_SOURCES } from "./demands/index.js";
 import { DEFAULT_BLOCK_KINDS } from "./kinds/index.js";
 var marksKey = new PluginKey("docxPageDecorations");
 function pushStyle(marginTop) {
@@ -46,9 +47,10 @@ function decorationsFor(doc, kinds, pushes, cuts) {
   });
   return DecorationSet.create(doc, decorations);
 }
-function marksFor(doc, kinds, pushes, cuts) {
+function marksFor(doc, { kinds, sources }, pushes, cuts) {
   return {
     kinds,
+    sources,
     pushes,
     cuts,
     decorations: decorationsFor(doc, kinds, pushes, cuts)
@@ -75,18 +77,18 @@ function samePageMarks(a, b) {
     return other !== void 0 && other.at === cut.at && other.height === cut.height;
   });
 }
-function pageDecorations(kinds = DEFAULT_BLOCK_KINDS) {
+function pageDecorations(kinds = DEFAULT_BLOCK_KINDS, sources = DEFAULT_DEMAND_SOURCES) {
   return new Plugin({
     key: marksKey,
     state: {
-      init: (_config, state) => marksFor(state.doc, kinds, [], []),
+      init: (_config, state) => marksFor(state.doc, { kinds, sources }, [], []),
       apply(tr, value) {
         const next = tr.getMeta(marksKey);
         if (next) return next;
         if (!tr.docChanged) return value;
         return marksFor(
           tr.doc,
-          value.kinds,
+          value,
           value.pushes.map((push) => ({
             ...push,
             pos: tr.mapping.map(push.pos)
@@ -106,6 +108,12 @@ function pageDecorations(kinds = DEFAULT_BLOCK_KINDS) {
 function blockKindsOf(state) {
   return marksKey.getState(state)?.kinds ?? DEFAULT_BLOCK_KINDS;
 }
+function demandSourcesOf(state) {
+  return marksKey.getState(state)?.sources ?? DEFAULT_DEMAND_SOURCES;
+}
+function pageCutsOf(state) {
+  return marksKey.getState(state)?.cuts ?? [];
+}
 function current(view) {
   return marksKey.getState(view.state) ?? { pushes: [], cuts: [] };
 }
@@ -116,7 +124,10 @@ function setPageMarks(view, next) {
       marksKey,
       marksFor(
         view.state.doc,
-        blockKindsOf(view.state),
+        {
+          kinds: blockKindsOf(view.state),
+          sources: demandSourcesOf(view.state)
+        },
         next.pushes,
         next.cuts
       )
@@ -125,6 +136,8 @@ function setPageMarks(view, next) {
 }
 export {
   blockKindsOf,
+  demandSourcesOf,
+  pageCutsOf,
   pageDecorations,
   setPageMarks
 };

package/dist/page/pageLayout.d.ts

@@ -19,6 +19,7 @@
 import { type PageGeometry } from "../docx/pageGeometry";
 import type { DocumentSection, SectionProperties } from "../docx/sections";
 import type { MeasuredBlock, PageCut } from "./blockKinds";
+import type { DemandBand } from "./demands";
 export type { MeasuredBlock };
 /** The paper measured in the pixels the sheet is drawn with */
 export interface PagePixels {
@@ -128,6 +129,51 @@ export interface PageStart {
      */
     crossed: boolean;
 }
+/** The room one page keeps at the foot of its body for one band (`page/demands`) */
+export interface PageReservation {
+    page: number;
+    band: string;
+    /** The ids the page keeps, in the order it took them: those carried over from the page before first */
+    ids: readonly string[];
+    /**
+     * Where the band starts, measured from the top of the body like a split. The bands a page keeps
+     * stand one under the next in the order it took them, from the end of its body above the room.
+     * A page that could not give its bands all the room they ask for gives them what lies under the
+     * text that has to stay on it, so a band starts no higher than that text ends
+     */
+    top: number;
+    /**
+     * The band's overhead and the height of each id, which the page's body ends above. A demand
+     * taller than an empty page's body is counted whole, though the page has less to give it
+     */
+    height: number;
+}
+/**
+ * Rows laid after the last block of the document rather than beside any place in it
+ * (`page/demands`), which is where the endnotes stand.
+ *
+ * They are given whatever the last page has left below its text, and go on down pages of their
+ * own from there. Nothing in the layout knows what they hold: a row is an id and a height, and
+ * what draws them is told back which page each landed on.
+ */
+export interface TrailingRows {
+    /** Height set aside once, above the first row, wherever the rows begin */
+    readonly overhead: number;
+    readonly rows: readonly {
+        readonly id: string;
+        readonly height: number;
+    }[];
+}
+/** The trailing rows one page holds, top to bottom */
+export interface TrailingPlacement {
+    page: number;
+    /** Where the rows begin on this page, measured from the top of the body like a split */
+    top: number;
+    /** The rows this page holds, in the order they are laid */
+    ids: readonly string[];
+    /** The rows' heights, and the overhead on the page the rows begin on */
+    height: number;
+}
 export interface PageLayout {
     /** Only the blocks to be moved down to the next page */
     pushes: BlockPush[];
@@ -144,6 +190,10 @@ export interface PageLayout {
      * margin needs the sheet drawn down to this.
      */
     marginBottom: number;
+    /** What each page keeps at its foot, page by page, one entry per band a page holds */
+    reserved: readonly PageReservation[];
+    /** Where the rows laid after the last block landed, one entry per page holding any */
+    trailing: readonly TrailingPlacement[];
 }
 export interface PageLayoutInput {
     blocks: readonly MeasuredBlock[];
@@ -153,6 +203,16 @@ export interface PageLayoutInput {
      * unless that section is `continuous`.
      */
     sections: readonly SectionPixels[];
+    /**
+     * The bands the blocks' demands are kept in, by name. A demand naming a band not given here is
+     * kept nowhere, so with none given the pages are the ones the blocks alone come to
+     */
+    bands?: ReadonlyMap<string, DemandBand>;
+    /**
+     * The rows laid after the last block, which open pages of their own where the last page has no
+     * room left for them. Left out, the pages end with the blocks
+     */
+    trailing?: TrailingRows;
 }
 /**
  * Distributes the blocks across pages.
@@ -169,5 +229,21 @@ export interface PageLayoutInput {
  * after it and the first piece of the block the keeps end at.
  * Each block is measured against the paper of its own section, and the first block of a section
  * opens a page of its own unless the section it opens declares `continuous`.
+ *
+ * A demand (`page/demands`) asks the page its place lands on for room at the foot, and that page's
+ * body ends above the room: whatever would stand in it is pushed, parted or crossed onto the next
+ * page exactly as at the end of the paper, the demand's own piece included when the room it asks
+ * for does not fit beneath that piece. The page ends and page tops stay where the paper puts them,
+ * except the place a block taller than a page crosses, which is the end of the body above the room.
+ * A demand is never parted. Where the content that has to stay on a page leaves no room for it, it
+ * is carried whole to the top of the next page's band with every demand after it on that page, and
+ * past the last block a page is opened for them; one taller than an empty page's body could fit
+ * nowhere, so it stays where it landed. A block that opens its page is never pushed off it to make
+ * room, which would leave a page holding nothing but what was carried onto it.
+ *
+ * The trailing rows are laid last, under the last block on the page it ends on, and go on down
+ * pages of their own where that page has no room left. They stand above whatever that page keeps
+ * at its foot, the way the text does, and a page opened for them belongs to the section the last
+ * block belongs to, so it carries that section's header and footer.
  */
-export declare function pageLayout({ blocks, sections }: PageLayoutInput): PageLayout;
+export declare function pageLayout({ blocks, sections, bands, trailing: trailingRows, }: PageLayoutInput): PageLayout;

package/dist/page/pageLayout.js

@@ -58,6 +58,60 @@ var TOLERANCE_PX = 0.5;
 function round(value) {
   return Math.round(value * 100) / 100;
 }
+var NO_BANDS = /* @__PURE__ */ new Map();
+var NO_DEMANDS = [];
+function emptyRoom() {
+  return { bands: /* @__PURE__ */ new Map(), kept: [], height: 0 };
+}
+function keep(bands, room, taken) {
+  const { demand } = taken;
+  const band = bands.get(demand.band);
+  if (!band || room.bands.get(demand.band)?.has(demand.id)) return;
+  const ids = room.bands.get(demand.band);
+  if (ids) {
+    ids.add(demand.id);
+  } else {
+    room.bands.set(demand.band, /* @__PURE__ */ new Set([demand.id]));
+    room.height += band.overhead;
+  }
+  room.kept.push(taken);
+  room.height += band.heights.get(demand.id) ?? 0;
+}
+function letGo(bands, room) {
+  const taken = room.kept.pop();
+  const band = taken && bands.get(taken.demand.band);
+  const ids = taken && room.bands.get(taken.demand.band);
+  if (!taken || !band || !ids) return void 0;
+  ids.delete(taken.demand.id);
+  room.height -= band.heights.get(taken.demand.id) ?? 0;
+  if (ids.size === 0) {
+    room.bands.delete(taken.demand.band);
+    room.height -= band.overhead;
+  }
+  if (room.kept.length === 0) room.height = 0;
+  return taken;
+}
+function bandHeight(band, ids) {
+  let height = band.overhead;
+  for (const id of ids) height += band.heights.get(id) ?? 0;
+  return height;
+}
+function roomAdded(bands, room, demands) {
+  if (demands.length === 0) return 0;
+  const trial = {
+    bands: new Map(
+      Array.from(room.bands, ([name, ids]) => [name, new Set(ids)])
+    ),
+    kept: [...room.kept],
+    height: room.height
+  };
+  for (const demand of demands) keep(bands, trial, { demand, order: 0 });
+  return trial.height - room.height;
+}
+function demandsInOrder(block) {
+  const demands = block.demands ?? NO_DEMANDS;
+  return demands.length < 2 ? demands : [...demands].sort((a, b) => a.offset - b.offset);
+}
 function withinSections(pages, sections) {
   let section = null;
   let within = 0;
@@ -101,10 +155,17 @@ function keptExtents(blocks, laid) {
   settle();
   return extents;
 }
-function pageLayout({ blocks, sections }) {
+function pageLayout({
+  blocks,
+  sections,
+  bands = NO_BANDS,
+  trailing: trailingRows
+}) {
   const pushes = [];
   const cuts = [];
   const splits = [];
+  const reserved = [];
+  const trailing = [];
   let blockPos = blocks[0]?.pos ?? 0;
   const opened = [
     { page: 1, bodyStart: 0, pos: blockPos, crossed: false }
@@ -119,7 +180,9 @@ function pageLayout({ blocks, sections }) {
       splits,
       pages: withinSections(opened, sections),
       bodyHeight: 0,
-      marginBottom: 0
+      marginBottom: 0,
+      reserved,
+      trailing
     };
   }
   const blockSections = blocks.map(
@@ -136,16 +199,82 @@ function pageLayout({ blocks, sections }) {
   let cursor = 0;
   let paper = laid[0]?.paper ?? roomy;
   const stepTo = (opening) => paper.pageStep - paper.marginTop + opening.marginTop;
+  let room = emptyRoom();
+  let carried = [];
+  let reached = 0;
+  let held = 0;
+  const reservedHere = () => Math.min(room.height, Math.max(0, pageStart + paper.bodyHeight - held));
+  const bodyEnd = () => pageStart + paper.bodyHeight - reservedHere();
+  const endsOnPage = (bottom) => bottom <= pageStart + paper.bodyHeight + TOLERANCE_PX;
+  const settle = (floor, onPaper = paper) => {
+    held = Math.max(held, floor);
+    while (held + room.height > pageStart + onPaper.bodyHeight + TOLERANCE_PX) {
+      const last = room.kept.at(-1);
+      if (last === void 0 || roomAdded(bands, emptyRoom(), [last.demand]) > onPaper.bodyHeight + TOLERANCE_PX) {
+        return;
+      }
+      letGo(bands, room);
+      carried.push(last);
+    }
+  };
+  const recordRoom = (page) => {
+    const held2 = [...room.bands].flatMap(([name, ids]) => {
+      const band = bands.get(name);
+      return band ? [{ name, ids, band }] : [];
+    }).sort((a, b) => b.band.order - a.band.order);
+    let top = bodyEnd();
+    for (const { name, ids, band } of held2) {
+      const height = bandHeight(band, ids);
+      reserved.push({
+        page,
+        band: name,
+        ids: [...ids],
+        top: round(top),
+        height: round(height)
+      });
+      top += height;
+    }
+  };
   const split = (y, crossed, forced, opening = paper) => {
     const page = splits.length + 2;
+    recordRoom(page - 1);
     splits.push({ y: round(y), page, forced, crossed });
     pageStart = crossed ? y : y + stepTo(opening);
     opened.push({ page, bodyStart: round(pageStart), pos: blockPos, crossed });
+    room = emptyRoom();
+    held = pageStart;
+    const waiting = carried;
+    carried = [];
+    waiting.sort((a, b) => a.order - b.order);
+    for (const taken of waiting) keep(bands, room, taken);
+    settle(pageStart, opening);
   };
   const crossTo = (y) => {
-    while (y > pageStart + paper.bodyHeight + TOLERANCE_PX) {
-      split(pageStart + paper.bodyHeight, true, false);
+    while (y > bodyEnd() + TOLERANCE_PX) {
+      const end = bodyEnd();
+      split(
+        end > pageStart + TOLERANCE_PX ? end : pageStart + paper.bodyHeight,
+        true,
+        false
+      );
+    }
+  };
+  const place = (bottom, demands, placeOf) => {
+    for (const demand of demands) {
+      if (!bands.has(demand.band)) continue;
+      if (!endsOnPage(bottom)) crossTo(placeOf(demand));
+      const taken = { demand, order: reached };
+      reached += 1;
+      const alreadyKept = room.bands.get(demand.band)?.has(demand.id) === true;
+      if (carried.length > 0 && !alreadyKept) {
+        carried.push(taken);
+      } else {
+        keep(bands, room, taken);
+        settle(placeOf(demand));
+      }
     }
+    if (endsOnPage(bottom)) settle(bottom);
+    crossTo(bottom);
   };
   const kept = keptExtents(blocks, laid);
   let breakAfterPrevious = false;
@@ -159,7 +288,10 @@ function pageLayout({ blocks, sections }) {
     const first = kept.get(index) ?? block.minFirstPiece;
     const overflows = top + first > pageEnd + TOLERANCE_PX;
     const fits = first <= opening.bodyHeight + TOLERANCE_PX;
-    const push = startsPage || overflows && fits ? Math.max(0, pageEnd + stepTo(opening) - top) : 0;
+    const demands = demandsInOrder(block);
+    const firstDemands = demands.length === 0 ? NO_DEMANDS : demands.filter((demand) => demand.offset < first);
+    const crowded = top > pageStart + TOLERANCE_PX && top + first + roomAdded(bands, room, firstDemands) > bodyEnd() + TOLERANCE_PX && first + roomAdded(bands, emptyRoom(), firstDemands) <= opening.bodyHeight + TOLERANCE_PX;
+    const push = startsPage || overflows && fits || crowded ? Math.max(0, pageEnd + stepTo(opening) - top) : 0;
     if (push > 0 || startsPage) split(pageEnd, false, startsPage, opening);
     paper = opening;
     if (push > 0) {
@@ -173,15 +305,23 @@ function pageLayout({ blocks, sections }) {
     const pageBodyHeight = paper.bodyHeight;
     let added = 0;
     let pieceStart = 0;
+    let untaken = 0;
     for (let index2 = 0; index2 <= block.candidates.length; index2 += 1) {
       const cut = index2 === 0 ? null : block.candidates[index2 - 1];
-      const pieceEnd = block.candidates[index2]?.offset ?? block.height;
+      const next = block.candidates[index2];
+      const pieceEnd = next?.offset ?? block.height;
+      const taken = untaken;
+      while (untaken < demands.length && (next === void 0 || (demands[untaken]?.offset ?? 0) < pieceEnd)) {
+        untaken += 1;
+      }
+      const pieceDemands = taken === untaken ? NO_DEMANDS : demands.slice(taken, untaken);
       const pieceTop = contentTop + pieceStart + added;
       let pieceBottom = contentTop + pieceEnd + added;
       if (cut) {
         if (cut.forced) crossTo(pieceTop);
         const pageBottom = pageStart + pageBodyHeight;
-        const cutHere = cut.forced || pieceBottom > pageBottom + TOLERANCE_PX && pieceTop > pageStart + TOLERANCE_PX && pieceEnd - pieceStart <= pageBodyHeight + TOLERANCE_PX;
+        const size = pieceEnd - pieceStart;
+        const cutHere = cut.forced || pieceTop > pageStart + TOLERANCE_PX && (pieceBottom > pageBottom + TOLERANCE_PX && size <= pageBodyHeight + TOLERANCE_PX || pieceBottom + roomAdded(bands, room, pieceDemands) > bodyEnd() + TOLERANCE_PX && size + roomAdded(bands, emptyRoom(), pieceDemands) <= pageBodyHeight + TOLERANCE_PX);
         if (cutHere) {
           split(pageBottom, false, cut.forced);
           const height = Math.max(0, pageStart - pieceTop);
@@ -190,12 +330,47 @@ function pageLayout({ blocks, sections }) {
           pieceBottom += height + cut.repeatHeight;
         }
       }
-      crossTo(pieceBottom);
+      const shift = contentTop + added;
+      place(pieceBottom, pieceDemands, (demand) => shift + demand.offset);
       pieceStart = pieceEnd;
     }
     cursor = contentTop + block.height + added;
     breakAfterPrevious = block.breakAfter;
   }
+  const drainCarried = () => {
+    while (carried.length > 0) {
+      split(pageStart + paper.bodyHeight, false, false);
+    }
+  };
+  drainCarried();
+  let laidHere;
+  let below = Math.max(cursor, pageStart);
+  for (const [at, row] of (trailingRows?.rows ?? []).entries()) {
+    const above = at === 0 ? trailingRows?.overhead ?? 0 : 0;
+    const opens = below + above + row.height > bodyEnd() + TOLERANCE_PX && below > pageStart + TOLERANCE_PX;
+    if (opens) {
+      laidHere = void 0;
+      split(pageStart + paper.bodyHeight, false, false);
+      below = pageStart;
+    }
+    const top = below + above;
+    if (laidHere === void 0) {
+      laidHere = {
+        page: splits.length + 1,
+        top: round(below),
+        ids: [row.id],
+        height: round(above + row.height)
+      };
+      trailing.push(laidHere);
+    } else {
+      laidHere.ids = [...laidHere.ids, row.id];
+      laidHere.height = round(laidHere.height + row.height);
+    }
+    below = top + row.height;
+    settle(below);
+  }
+  drainCarried();
+  recordRoom(splits.length + 1);
   return {
     pushes,
     cuts,
@@ -203,7 +378,9 @@ function pageLayout({ blocks, sections }) {
     pages: withinSections(opened, sections),
     // The last page is filled out in full on the paper of the section it opens with
     bodyHeight: round(pageStart + paper.bodyHeight),
-    marginBottom: paper.marginBottom
+    marginBottom: paper.marginBottom,
+    reserved,
+    trailing
   };
 }
 export {