fix: rendering and text alignment for textboxes with table content

packages/layout-engine/layout-engine/src/anchors.test.ts

@@ -677,11 +677,14 @@ describe('anchors', () => {
 
       const result = collectAnchoredDrawings(blocks, measures);
       expect(result.size).toBe(0);
+      expect(result.withoutParagraph).toHaveLength(1);
+      expect(result.withoutParagraph[0]?.block.id).toBe('img-1');
     });
 
     it('should handle empty blocks array', () => {
       const result = collectAnchoredDrawings([], []);
       expect(result.size).toBe(0);
+      expect(result.withoutParagraph).toHaveLength(0);
     });
 
     it('should handle anchored images with undefined vRelativeFrom (defaults to paragraph)', () => {

packages/layout-engine/layout-engine/src/anchors.ts

@@ -22,6 +22,14 @@ export type AnchoredDrawing = {
   measure: ImageMeasure | DrawingMeasure;
 };
 
+export type AnchoredDrawingCollection = {
+  byParagraph: Map<number, AnchoredDrawing[]>;
+  withoutParagraph: AnchoredDrawing[];
+  readonly size: number;
+  has(index: number): boolean;
+  get(index: number): AnchoredDrawing[] | undefined;
+};
+
 export type AnchoredTable = {
   block: TableBlock;
   measure: TableMeasure;
@@ -130,8 +138,9 @@ export function collectPreRegisteredAnchors(blocks: FlowBlock[], measures: Measu
  * Collect anchored drawings (images/drawings) mapped to their anchor paragraph index.
  * Map of paragraph block index -> anchored images/drawings associated with that paragraph.
  */
-export function collectAnchoredDrawings(blocks: FlowBlock[], measures: Measure[]): Map<number, AnchoredDrawing[]> {
-  const map = new Map<number, AnchoredDrawing[]>();
+export function collectAnchoredDrawings(blocks: FlowBlock[], measures: Measure[]): AnchoredDrawingCollection {
+  const byParagraph = new Map<number, AnchoredDrawing[]>();
+  const withoutParagraph: AnchoredDrawing[] = [];
   const len = Math.min(blocks.length, measures.length);
   const paragraphIndexById = buildParagraphIndexById(blocks, len);
 
@@ -159,15 +168,27 @@ export function collectAnchoredDrawings(blocks: FlowBlock[], measures: Measure[]
       typeof drawingBlock.attrs === 'object' && drawingBlock.attrs
         ? (drawingBlock.attrs as { anchorParagraphId?: unknown }).anchorParagraphId
         : undefined;
+    const anchoredDrawing = { block: drawingBlock, measure: drawingMeasure };
     const anchorParaIndex = resolveAnchorParagraphIndex(blocks, len, paragraphIndexById, i, anchorParagraphId);
-    if (anchorParaIndex == null) continue; // no paragraphs at all
+    if (anchorParaIndex == null) {
+      withoutParagraph.push(anchoredDrawing);
+      continue;
+    }
 
-    const list = map.get(anchorParaIndex) ?? [];
-    list.push({ block: drawingBlock, measure: drawingMeasure });
-    map.set(anchorParaIndex, list);
+    const list = byParagraph.get(anchorParaIndex) ?? [];
+    list.push(anchoredDrawing);
+    byParagraph.set(anchorParaIndex, list);
   }
 
-  return map;
+  return {
+    byParagraph,
+    withoutParagraph,
+    get size() {
+      return byParagraph.size;
+    },
+    has: (index: number) => byParagraph.has(index),
+    get: (index: number) => byParagraph.get(index),
+  };
 }
 
 /**

packages/layout-engine/layout-engine/src/index.test.ts

@@ -15,6 +15,7 @@ import type {
   ColumnBreakBlock,
   PageBreakBlock,
   TableBlock,
+  TableFragment,
   TableMeasure,
 } from '@superdoc/contracts';
 import { layoutDocument, layoutHeaderFooter, type LayoutOptions } from './index.js';
@@ -989,6 +990,47 @@ describe('layoutDocument', () => {
     expect(fragment?.y).toBe(DEFAULT_OPTIONS.margins!.top + 15);
   });
 
+  it('renders paragraphless anchored drawings and floating tables on the same fallback page', () => {
+    const imageBlock: ImageBlock = {
+      kind: 'image',
+      id: 'paragraphless-floating-image',
+      src: 'data:image/png;base64,xxx',
+      anchor: {
+        isAnchored: true,
+        hRelativeFrom: 'column',
+        vRelativeFrom: 'paragraph',
+        offsetH: 24,
+        offsetV: 36,
+      },
+      wrap: { type: 'Square' },
+    };
+    const imageMeasure: ImageMeasure = {
+      kind: 'image',
+      width: 80,
+      height: 40,
+    };
+    const floatingTable = makeParagraphlessFloatingTable('paragraphless-floating-table');
+    const floatingTableMeasure = makeTableMeasure([220], [60]);
+
+    const layout = layoutDocument([floatingTable, imageBlock], [floatingTableMeasure, imageMeasure], DEFAULT_OPTIONS);
+
+    expect(layout.pages).toHaveLength(1);
+
+    const imageFragment = layout.pages[0].fragments.find(
+      (candidate) => candidate.kind === 'image' && candidate.blockId === 'paragraphless-floating-image',
+    ) as ImageFragment | undefined;
+    const tableFragment = layout.pages[0].fragments.find(
+      (candidate) => candidate.kind === 'table' && candidate.blockId === 'paragraphless-floating-table',
+    ) as TableFragment | undefined;
+
+    expect(imageFragment).toBeTruthy();
+    expect(tableFragment).toBeTruthy();
+    expect(imageFragment?.x).toBe(DEFAULT_OPTIONS.margins!.left + 24);
+    expect(imageFragment?.y).toBe(DEFAULT_OPTIONS.margins!.top + 36);
+    expect(tableFragment?.x).toBe(120);
+    expect(tableFragment?.y).toBe(DEFAULT_OPTIONS.margins!.top + 15);
+  });
+
   it('renders a floating table after pruning a leading empty page', () => {
     const leadingPageBreak: PageBreakBlock = {
       kind: 'pageBreak',
@@ -4432,6 +4474,104 @@ describe('layoutHeaderFooter', () => {
     expect(Array.isArray(fragment.contentMeasures)).toBe(true);
     expect(fragment.contentMeasures).toHaveLength(1);
   });
+
+  it('places paragraphless anchored textboxShape blocks in header/footer layout', () => {
+    const textboxBlock: FlowBlock = {
+      kind: 'drawing',
+      id: 'header-textbox-1',
+      drawingKind: 'textboxShape',
+      geometry: { width: 120, height: 40, rotation: 0, flipH: false, flipV: false },
+      anchor: {
+        isAnchored: true,
+        hRelativeFrom: 'column',
+        vRelativeFrom: 'paragraph',
+        offsetH: -10,
+        offsetV: -6,
+      },
+      contentBlocks: [
+        {
+          kind: 'paragraph',
+          id: 'header-textbox-para-1',
+          runs: [{ text: 'Header text', pmStart: 1, pmEnd: 12 }],
+        },
+      ],
+      textInsets: { top: 4, right: 8, bottom: 4, left: 8 },
+    };
+    const textboxMeasure: DrawingMeasure = {
+      kind: 'drawing',
+      drawingKind: 'textboxShape',
+      width: 120,
+      height: 40,
+      scale: 1,
+      naturalWidth: 120,
+      naturalHeight: 40,
+      geometry: { width: 120, height: 40, rotation: 0, flipH: false, flipV: false },
+    };
+
+    const layout = layoutHeaderFooter(
+      [textboxBlock],
+      [textboxMeasure],
+      { width: 400, height: 80 },
+      'header',
+      (_block, _maxWidth) => makeMeasure([16]),
+    );
+
+    expect(layout.pages).toHaveLength(1);
+    const fragment = layout.pages[0].fragments[0] as DrawingFragment;
+    expect(fragment.kind).toBe('drawing');
+    expect(fragment.blockId).toBe('header-textbox-1');
+    expect(fragment.isAnchored).toBe(true);
+    expect(fragment.x).toBe(-10);
+    expect(fragment.y).toBe(-6);
+    expect(fragment.contentMeasures).toHaveLength(1);
+  });
+
+  it('places paragraphless page-relative behindDoc header images at page offsets', () => {
+    const imageBlock: FlowBlock = {
+      kind: 'image',
+      id: 'header-bg-image',
+      src: 'data:image/png;base64,xxx',
+      anchor: {
+        isAnchored: true,
+        hRelativeFrom: 'page',
+        vRelativeFrom: 'page',
+        offsetH: 1387 * (96 / 914400),
+        offsetV: 254000 * (96 / 914400),
+        behindDoc: true,
+      },
+      wrap: { type: 'None', behindDoc: true },
+    };
+    const imageMeasure: ImageMeasure = {
+      kind: 'image',
+      width: 7557463 * (96 / 914400),
+      height: 10723880 * (96 / 914400),
+    };
+
+    const layout = layoutHeaderFooter(
+      [imageBlock],
+      [imageMeasure],
+      {
+        width: 602,
+        height: 648,
+        pageWidth: 816,
+        pageHeight: 1056,
+        margins: { left: 107, right: 107, top: 72, bottom: 72, header: 36 },
+      },
+      'header',
+    );
+
+    expect(layout.pages).toHaveLength(1);
+    const fragment = layout.pages[0].fragments[0] as ImageFragment;
+    expect(fragment.kind).toBe('image');
+    expect(fragment.blockId).toBe('header-bg-image');
+    expect(fragment.isAnchored).toBe(true);
+    expect(fragment.behindDoc).toBe(true);
+    expect(fragment.zIndex).toBe(0);
+    expect(fragment.x).toBeCloseTo(0.15, 2);
+    expect(fragment.y).toBeCloseTo(26.67, 2);
+    expect(layout.height).toBe(0);
+    expect(layout.renderHeight).toBeGreaterThan(1000);
+  });
 });
 
 describe('requirePageBoundary edge cases', () => {