@jasy/pdf 1.0.0-alpha.1

package/dist/elements/pdf-element.d.ts

@@ -0,0 +1,67 @@
+import type { FontMetrics } from "../utils/font-metrics";
+import type { PDFPageConfig } from "./page-element";
+import type { BoxConstraints, Offset, Size } from "../layout/box-constraints";
+/**
+ * Everything the layout pass needs, threaded explicitly (no global singleton):
+ * font metrics for measuring, and the geometry of the page currently being laid out.
+ * `PageElement` sets `pageConfig` for its subtree, so each page flips against its own
+ * height. The PDF byte writer is deliberately absent - layout must not touch it.
+ */
+export interface LayoutContext {
+    metrics: FontMetrics;
+    pageConfig: PDFPageConfig;
+}
+export declare abstract class PDFElement {
+    abstract getProps(): unknown;
+    /**
+     * Lays the element out: `constraints` bound its size (flows DOWN), `offset` is the
+     * absolute top-left position the parent assigns it, and the returned `Size` is the
+     * space it actually took (flows UP). Layout works in a top-left origin; the Y-flip
+     * happens once at the IR -> backend seam.
+     */
+    abstract calculateLayout(constraints: BoxConstraints, offset: Offset, ctx: LayoutContext): Size;
+}
+export declare abstract class SizedPDFElement extends PDFElement {
+    protected x: number;
+    protected y: number;
+    protected width?: number;
+    protected height?: number;
+    constructor(data: SizedElement);
+    getSize(): SizedElement;
+}
+export declare abstract class FlexiblePDFElement extends PDFElement {
+    protected flex: number;
+    protected verticalChildAlignment: VerticalAlignment;
+    constructor(data: FlexibleElement);
+    getFlex(): number;
+}
+export declare enum HorizontalAlignment {
+    left = "LEFT",
+    right = "RIGHT",
+    center = "CENTER",
+    block = "BLOCK"
+}
+export declare enum VerticalAlignment {
+    top = "TOP",
+    middle = "MIDDLE",
+    bottom = "BOTTOM"
+}
+export interface WithChildren {
+    children: PDFElement[];
+}
+export interface WithChild {
+    child: PDFElement;
+}
+export interface FlexibleElement {
+    flex: number;
+    verticalChildAlignment?: VerticalAlignment;
+}
+export interface SizedElement {
+    x: number;
+    y: number;
+    width?: number;
+    height?: number;
+}
+export declare function isSizedElement(obj: unknown): obj is SizedElement;
+export declare function hasChildrenProp<T extends object>(obj: T): obj is T & WithChildren;
+export declare function hasChildProp<T extends object>(obj: T): obj is T & WithChild;

package/dist/elements/pdf-element.js

@@ -0,0 +1,55 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VerticalAlignment = exports.HorizontalAlignment = exports.FlexiblePDFElement = exports.SizedPDFElement = exports.PDFElement = void 0;
+exports.isSizedElement = isSizedElement;
+exports.hasChildrenProp = hasChildrenProp;
+exports.hasChildProp = hasChildProp;
+class PDFElement {
+}
+exports.PDFElement = PDFElement;
+class SizedPDFElement extends PDFElement {
+    constructor(data) {
+        super();
+        this.x = data.x;
+        this.y = data.y;
+        this.width = data.width;
+        this.height = data.height;
+    }
+    getSize() {
+        return { x: this.x, y: this.y, width: this.width, height: this.height };
+    }
+}
+exports.SizedPDFElement = SizedPDFElement;
+class FlexiblePDFElement extends PDFElement {
+    constructor(data) {
+        super();
+        this.flex = data.flex;
+        this.verticalChildAlignment = data.verticalChildAlignment || VerticalAlignment.middle;
+    }
+    getFlex() {
+        return this.flex;
+    }
+}
+exports.FlexiblePDFElement = FlexiblePDFElement;
+var HorizontalAlignment;
+(function (HorizontalAlignment) {
+    HorizontalAlignment["left"] = "LEFT";
+    HorizontalAlignment["right"] = "RIGHT";
+    HorizontalAlignment["center"] = "CENTER";
+    HorizontalAlignment["block"] = "BLOCK";
+})(HorizontalAlignment || (exports.HorizontalAlignment = HorizontalAlignment = {}));
+var VerticalAlignment;
+(function (VerticalAlignment) {
+    VerticalAlignment["top"] = "TOP";
+    VerticalAlignment["middle"] = "MIDDLE";
+    VerticalAlignment["bottom"] = "BOTTOM";
+})(VerticalAlignment || (exports.VerticalAlignment = VerticalAlignment = {}));
+function isSizedElement(obj) {
+    return typeof obj === "object" && obj !== null && "x" in obj && "y" in obj;
+}
+function hasChildrenProp(obj) {
+    return "children" in obj;
+}
+function hasChildProp(obj) {
+    return "child" in obj;
+}

package/dist/elements/rectangle-element.d.ts

@@ -0,0 +1,55 @@
+import { Color } from "../common/color";
+import { BoxConstraints, Offset, Size } from "../layout/box-constraints";
+import { Fragmentable, FragmentResult } from "../layout/fragmentation";
+import { LayoutContext, PDFElement, SizedElement, SizedPDFElement, WithChildren } from "./pdf-element";
+/** Per-side border colours. When set, each present side is stroked individually (sharp
+ *  corners), instead of the uniform `color` border - this is what enables grid lines. */
+export interface SideBorders {
+    top?: Color;
+    right?: Color;
+    bottom?: Color;
+    left?: Color;
+}
+interface RectangleElementParams extends SizedElement, WithChildren {
+    color?: Color;
+    backgroundColor?: Color;
+    borderWidth?: number;
+    /** Corner radius in points; 0 = sharp corners (default). */
+    radius?: number;
+    /** Individual side borders; overrides the uniform `color` border when present. */
+    sideBorders?: SideBorders;
+}
+export declare class RectangleElement extends SizedPDFElement implements Fragmentable {
+    private children;
+    private color;
+    private backgroundColor?;
+    private borderWidth;
+    private radius;
+    private sideBorders?;
+    private sizeMemory;
+    constructor({ children, color, backgroundColor, borderWidth, width, height, radius, sideBorders, }: RectangleElementParams);
+    /**
+     * Splits the bordered box across pages (box-decoration-break: clone - every fragment
+     * gets its own full border). The children stack is packed into the space left after
+     * reserving the border on top and bottom; each fragment then shrink-wraps its own
+     * content (explicit height = content + 2*border) so the border hugs the text instead of
+     * filling the page. An explicit box height is intentionally overridden here - a split
+     * box is sized by what it actually holds on each page.
+     */
+    fragment(maxHeight: number, width: number, ctx: LayoutContext): FragmentResult;
+    private cloneWithChildren;
+    calculateLayout(constraints: BoxConstraints, offset: Offset, ctx: LayoutContext): Size;
+    getProps(): {
+        x: number;
+        y: number;
+        width: number;
+        height: number | undefined;
+        children: PDFElement[];
+        color: Color;
+        backgroundColor: Color | undefined;
+        borderWidth: number;
+        radius: number;
+        sideBorders: SideBorders | undefined;
+    };
+}
+export {};

package/dist/elements/rectangle-element.js

@@ -0,0 +1,120 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RectangleElement = void 0;
+const color_1 = require("../common/color");
+const box_constraints_1 = require("../layout/box-constraints");
+const fragmentation_1 = require("../layout/fragmentation");
+const pdf_element_1 = require("./pdf-element");
+class RectangleElement extends pdf_element_1.SizedPDFElement {
+    constructor({ children = [], color = new color_1.Color(0, 0, 0), backgroundColor, borderWidth, width, height, radius, sideBorders, }) {
+        super({ x: 0, y: 0, width, height });
+        this.children = [];
+        this.children = children;
+        this.color = color;
+        this.backgroundColor = backgroundColor;
+        // `?? 1` (not `|| 1`) so an explicit `0` means "no border" instead of snapping to 1.
+        this.borderWidth = borderWidth !== null && borderWidth !== void 0 ? borderWidth : 1;
+        this.radius = radius !== null && radius !== void 0 ? radius : 0;
+        this.sideBorders = sideBorders;
+        this.sizeMemory = { x: 0, y: 0, width, height };
+    }
+    /**
+     * Splits the bordered box across pages (box-decoration-break: clone - every fragment
+     * gets its own full border). The children stack is packed into the space left after
+     * reserving the border on top and bottom; each fragment then shrink-wraps its own
+     * content (explicit height = content + 2*border) so the border hugs the text instead of
+     * filling the page. An explicit box height is intentionally overridden here - a split
+     * box is sized by what it actually holds on each page.
+     */
+    fragment(maxHeight, width, ctx) {
+        var _a;
+        const boxWidth = (_a = this.sizeMemory.width) !== null && _a !== void 0 ? _a : width;
+        const innerWidth = Math.max(0, boxWidth - 2 * this.borderWidth);
+        // Border-box: the content is inset by the border on top and bottom, so a fragment
+        // holding `c` of content is `c + 2*border` tall. (Derived, not a fudge factor.)
+        const innerMaxHeight = maxHeight - 2 * this.borderWidth;
+        const { fitted, remainder } = (0, fragmentation_1.packChildren)(this.children, innerMaxHeight, innerWidth, ctx);
+        if (remainder.length === 0)
+            return { fitted: this, remainder: null };
+        const contentHeight = (kids) => kids.reduce((sum, child) => sum +
+            child.calculateLayout(box_constraints_1.BoxConstraints.loose(innerWidth, Infinity), { x: 0, y: 0 }, ctx)
+                .height, 0);
+        return {
+            fitted: this.cloneWithChildren(fitted, contentHeight(fitted) + 2 * this.borderWidth),
+            remainder: this.cloneWithChildren(remainder, contentHeight(remainder) + 2 * this.borderWidth),
+        };
+    }
+    cloneWithChildren(children, height) {
+        return new RectangleElement({
+            x: 0,
+            y: 0,
+            width: this.sizeMemory.width,
+            height,
+            children,
+            color: this.color,
+            backgroundColor: this.backgroundColor,
+            borderWidth: this.borderWidth,
+            radius: this.radius,
+            sideBorders: this.sideBorders,
+        });
+    }
+    calculateLayout(constraints, offset, ctx) {
+        var _a, _b, _c;
+        // Width: an explicit size wins (clamped), else fill the offered box. (Without this a
+        // fixed box would balloon to the parent's size.)
+        this.width =
+            this.sizeMemory.width !== undefined
+                ? constraints.constrainWidth(this.sizeMemory.width)
+                : constraints.hasBoundedWidth
+                    ? constraints.maxWidth
+                    : this.width;
+        // Height: explicit wins; otherwise FILL a bounded region (e.g. inside an Expanded) but
+        // SHRINK-WRAP the content in an unbounded one (a note box in a stack). Shrink-wrap is
+        // resolved after the children are measured, just below.
+        const shrinkWrapHeight = this.sizeMemory.height === undefined && !constraints.hasBoundedHeight;
+        this.height =
+            this.sizeMemory.height !== undefined
+                ? constraints.constrainHeight(this.sizeMemory.height)
+                : constraints.hasBoundedHeight
+                    ? constraints.maxHeight
+                    : this.height;
+        this.x = this.sizeMemory.x + offset.x;
+        this.y = this.sizeMemory.y + offset.y;
+        // Lay out children stacked inside the border (inset by the border width). Width is
+        // finalized here; height is left unbounded so each child sizes to its own content.
+        const innerWidth = Math.max(0, ((_a = this.width) !== null && _a !== void 0 ? _a : 0) - 2 * this.borderWidth);
+        let contentHeight = 0;
+        let yCursor = this.y + this.borderWidth;
+        for (const child of this.children) {
+            const childSize = child.calculateLayout(box_constraints_1.BoxConstraints.loose(innerWidth, Infinity), { x: this.x + this.borderWidth, y: yCursor }, ctx);
+            yCursor += childSize.height;
+            contentHeight += childSize.height;
+        }
+        // No explicit height and no bounded region: the border hugs its content.
+        if (shrinkWrapHeight)
+            this.height = contentHeight + 2 * this.borderWidth;
+        // Border-box model: width/height ARE the outer box (the rect we draw); the content
+        // is inset by the border on every side. Report the honest box size - no phantom
+        // border added on (that asymmetric "+border" was the source of the magic-3 fudge in
+        // fragment). Top-left coordinates; the Y-flip happens at the IR -> backend seam.
+        return {
+            width: (_b = this.width) !== null && _b !== void 0 ? _b : 0,
+            height: (_c = this.height) !== null && _c !== void 0 ? _c : 0,
+        };
+    }
+    getProps() {
+        return {
+            x: this.x,
+            y: this.y,
+            width: this.width,
+            height: this.height,
+            children: this.children,
+            color: this.color,
+            backgroundColor: this.backgroundColor,
+            borderWidth: this.borderWidth,
+            radius: this.radius,
+            sideBorders: this.sideBorders,
+        };
+    }
+}
+exports.RectangleElement = RectangleElement;

package/dist/elements/row-element.d.ts

@@ -0,0 +1,42 @@
+import { BoxConstraints, Offset, Size } from "../layout/box-constraints";
+import { MainAlign, CrossAlign } from "../utils/flex-layout";
+import { LayoutContext, PDFElement, SizedPDFElement, WithChildren } from "./pdf-element";
+interface RowElementParams extends WithChildren {
+    /** Space inserted between children, in points. */
+    gap?: number;
+    /** Horizontal distribution of the children (main axis). */
+    main?: MainAlign;
+    /** Vertical alignment of each child (cross axis); defaults to `stretch`. */
+    cross?: CrossAlign;
+}
+/**
+ * Horizontal stack: the mirror of `ContainerElement` (Column). Children are laid out
+ * left-to-right via the shared `FlexLayoutHelper` on the horizontal axis; fixed children
+ * take their natural width, `ExpandedElement`/Spacer children split the leftover width by
+ * `flex`, and `gap` is inserted between them. The row fills the width it is offered and
+ * shrink-wraps its height to the tallest child (unless a height is forced on it).
+ *
+ * Cross/main alignment is the next foundation slice; today children sit at the top-left
+ * (cross start, main start). The row is atomic w.r.t. pagination - it reflows whole if it
+ * does not fit (handled by the parent's `packChildren`); synchronized cell splitting is a
+ * Grid/Table concern.
+ */
+export declare class RowElement extends SizedPDFElement {
+    private children;
+    private gap;
+    private main;
+    private cross;
+    constructor({ children, gap, main, cross }: RowElementParams);
+    calculateLayout(constraints: BoxConstraints, offset: Offset, ctx: LayoutContext): Size;
+    getProps(): {
+        x: number;
+        y: number;
+        width: number | undefined;
+        height: number | undefined;
+        children: PDFElement[];
+        gap: number;
+        main: MainAlign;
+        cross: CrossAlign;
+    };
+}
+export {};

package/dist/elements/row-element.js

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RowElement = void 0;
+const flex_layout_1 = require("../utils/flex-layout");
+const pdf_element_1 = require("./pdf-element");
+/**
+ * Horizontal stack: the mirror of `ContainerElement` (Column). Children are laid out
+ * left-to-right via the shared `FlexLayoutHelper` on the horizontal axis; fixed children
+ * take their natural width, `ExpandedElement`/Spacer children split the leftover width by
+ * `flex`, and `gap` is inserted between them. The row fills the width it is offered and
+ * shrink-wraps its height to the tallest child (unless a height is forced on it).
+ *
+ * Cross/main alignment is the next foundation slice; today children sit at the top-left
+ * (cross start, main start). The row is atomic w.r.t. pagination - it reflows whole if it
+ * does not fit (handled by the parent's `packChildren`); synchronized cell splitting is a
+ * Grid/Table concern.
+ */
+class RowElement extends pdf_element_1.SizedPDFElement {
+    constructor({ children, gap, main, cross }) {
+        super({ x: 0, y: 0 });
+        this.children = children;
+        this.gap = gap !== null && gap !== void 0 ? gap : 0;
+        this.main = main !== null && main !== void 0 ? main : "start";
+        this.cross = cross !== null && cross !== void 0 ? cross : "stretch";
+    }
+    calculateLayout(constraints, offset, ctx) {
+        this.x = offset.x;
+        this.y = offset.y;
+        // Width fills the offered space (flex children split the leftover); height is the
+        // tallest child unless the parent bounds it.
+        const mainAvail = constraints.hasBoundedWidth ? constraints.maxWidth : Infinity;
+        const crossAvail = constraints.hasBoundedHeight ? constraints.maxHeight : Infinity;
+        let result = { mainUsed: 0, crossUsed: 0 };
+        if (this.children.length > 0) {
+            result = flex_layout_1.FlexLayoutHelper.layout(this.children, flex_layout_1.HORIZONTAL_AXIS, mainAvail, crossAvail, this.x, this.y, { gap: this.gap, main: this.main, cross: this.cross }, ctx);
+        }
+        this.width = constraints.hasBoundedWidth ? constraints.maxWidth : result.mainUsed;
+        this.height = constraints.hasBoundedHeight ? constraints.maxHeight : result.crossUsed;
+        return { width: this.width, height: this.height };
+    }
+    getProps() {
+        return {
+            x: this.x,
+            y: this.y,
+            width: this.width,
+            height: this.height,
+            children: this.children,
+            gap: this.gap,
+            main: this.main,
+            cross: this.cross,
+        };
+    }
+}
+exports.RowElement = RowElement;

package/dist/elements/text-element.d.ts

@@ -0,0 +1,59 @@
+import { Color } from "../common/color";
+import { FontStyle } from "../utils/pdf-object-manager";
+import { BoxConstraints, Offset, Size } from "../layout/box-constraints";
+import { Fragmentable, FragmentResult } from "../layout/fragmentation";
+import { HorizontalAlignment, LayoutContext, SizedPDFElement } from "./pdf-element";
+export interface TextSegment {
+    content: string;
+    fontStyle?: FontStyle;
+    fontColor?: Color;
+    fontFamily?: string;
+    fontSize?: number;
+}
+interface TextElementParams {
+    id?: string;
+    fontSize: number;
+    fontFamily?: string;
+    fontStyle?: FontStyle;
+    content: string | TextSegment[];
+    color?: Color;
+    textAlignment?: HorizontalAlignment;
+}
+export declare class TextElement extends SizedPDFElement implements Fragmentable {
+    private fontSize;
+    private fontFamily;
+    private fontStyle;
+    private color;
+    private content;
+    private textAlignment;
+    constructor({ fontSize, content, fontFamily, fontStyle, color, textAlignment, }: TextElementParams);
+    /**
+     * Splits the paragraph at line boxes (Slice 1). The lines that fit in `maxHeight` stay;
+     * the rest become a remainder `TextElement` re-wrapped on the next page. If not even one
+     * line fits, nothing is forced here - the caller (the container) decides whether to move
+     * the whole element on for progress. Handles both plain strings and styled segments.
+     */
+    fragment(maxHeight: number, width: number, ctx: LayoutContext): FragmentResult;
+    private fragmentString;
+    private fragmentSegments;
+    private cloneWithContent;
+    calculateLayout(constraints: BoxConstraints, offset: Offset, ctx: LayoutContext): Size;
+    /** The unwrapped single-line width of the content (used when width is unbounded, e.g. inside a Row).
+     *  Mirrors the renderer's advance EXACTLY: per-glyph, WITHOUT kerning. `getStringWidth` subtracts
+     *  kerning, so it under-reserves and the text would wrap inside its own natural-width box - the cause
+     *  of fixed Row children wrapping despite ample space. */
+    private naturalWidth;
+    getProps(): {
+        x: number;
+        y: number;
+        width: number | undefined;
+        height: number | undefined;
+        fontSize: number;
+        fontFamily: string;
+        fontStyle: FontStyle;
+        color: Color;
+        content: string | TextSegment[];
+        textAlignment: HorizontalAlignment;
+    };
+}
+export {};

package/dist/elements/text-element.js

@@ -0,0 +1,137 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TextElement = void 0;
+const color_1 = require("../common/color");
+// Import the renderer DIRECTLY, not via the "../renderer" barrel: the barrel pulls in
+// pdf-renderer (and every element) while this element module is still loading, which under
+// ESM (Vite/vitest, and the future framework bindings) duplicates the element classes and
+// breaks the constructor-keyed RendererRegistry. A direct import keeps the graph acyclic.
+const text_renderer_1 = require("../renderer/text-renderer");
+const pdf_object_manager_1 = require("../utils/pdf-object-manager");
+const line_breaker_1 = require("../text/line-breaker");
+const pdf_element_1 = require("./pdf-element");
+class TextElement extends pdf_element_1.SizedPDFElement {
+    constructor({ fontSize, content, fontFamily = "Helvetica", fontStyle = pdf_object_manager_1.FontStyle.Normal, color = new color_1.Color(0, 0, 0), textAlignment = pdf_element_1.HorizontalAlignment.left, }) {
+        super({ x: 0, y: 0 });
+        this.fontSize = fontSize;
+        this.fontFamily = fontFamily;
+        this.fontStyle = fontStyle;
+        this.color = color;
+        this.content = content;
+        this.textAlignment = textAlignment;
+    }
+    /**
+     * Splits the paragraph at line boxes (Slice 1). The lines that fit in `maxHeight` stay;
+     * the rest become a remainder `TextElement` re-wrapped on the next page. If not even one
+     * line fits, nothing is forced here - the caller (the container) decides whether to move
+     * the whole element on for progress. Handles both plain strings and styled segments.
+     */
+    fragment(maxHeight, width, ctx) {
+        return typeof this.content === "string"
+            ? this.fragmentString(this.content, maxHeight, width, ctx)
+            : this.fragmentSegments(this.content, maxHeight, width, ctx);
+    }
+    // Plain string: every wrapped line is `fontSize` tall (matches calculateTextHeight),
+    // so `floor(maxHeight / fontSize)` lines fit.
+    fragmentString(content, maxHeight, width, ctx) {
+        const lines = (0, line_breaker_1.wrapStringIntoLines)(content, this.fontFamily, this.fontSize, this.fontStyle, width, ctx.metrics);
+        const fittedLineCount = Math.floor(maxHeight / this.fontSize);
+        if (fittedLineCount <= 0)
+            return { fitted: null, remainder: this };
+        if (fittedLineCount >= lines.length)
+            return { fitted: this, remainder: null };
+        return {
+            fitted: this.cloneWithContent(lines.slice(0, fittedLineCount).join(" ")),
+            remainder: this.cloneWithContent(lines.slice(fittedLineCount).join(" ")),
+        };
+    }
+    // Styled segments: each line's height is its tallest font (maxFontSize), so pack lines
+    // by cumulative leading. Rebuild the fitted/remainder halves back into TextSegment[].
+    fragmentSegments(content, maxHeight, width, ctx) {
+        const lines = (0, line_breaker_1.breakSegmentsIntoLines)(content, {
+            fontFamily: this.fontFamily,
+            fontSize: this.fontSize,
+            fontStyle: this.fontStyle,
+        }, width, ctx.metrics);
+        let used = 0;
+        let fittedLineCount = 0;
+        for (const line of lines) {
+            if (used + line.maxFontSize > maxHeight)
+                break;
+            used += line.maxFontSize;
+            fittedLineCount++;
+        }
+        if (fittedLineCount <= 0)
+            return { fitted: null, remainder: this };
+        if (fittedLineCount >= lines.length)
+            return { fitted: this, remainder: null };
+        return {
+            fitted: this.cloneWithContent((0, line_breaker_1.segmentLinesToSegments)(lines.slice(0, fittedLineCount))),
+            remainder: this.cloneWithContent((0, line_breaker_1.segmentLinesToSegments)(lines.slice(fittedLineCount))),
+        };
+    }
+    // A copy carrying the same style but different (already-wrapped) content. Re-wrapping at
+    // the same width reproduces exactly those lines (greedy is deterministic).
+    cloneWithContent(content) {
+        return new TextElement({
+            content,
+            fontSize: this.fontSize,
+            fontFamily: this.fontFamily,
+            fontStyle: this.fontStyle,
+            color: this.color,
+            textAlignment: this.textAlignment,
+        });
+    }
+    calculateLayout(constraints, offset, ctx) {
+        var _a;
+        this.x = offset.x;
+        this.y = offset.y;
+        // Bounded width (e.g. inside a Column) wraps to that width; an unbounded width
+        // (e.g. inside a Row) means the text takes its natural single-line width and does
+        // not wrap. Columns always bound the width, so this leaves their layout untouched.
+        this.width = constraints.hasBoundedWidth
+            ? constraints.maxWidth
+            : this.naturalWidth(ctx.metrics);
+        const wrapWidth = (_a = this.width) !== null && _a !== void 0 ? _a : 0;
+        this.height = text_renderer_1.TextRenderer.calculateTextHeight(this.content, this.fontSize, this.fontFamily, this.fontStyle, ctx.metrics, wrapWidth);
+        // Top-left coordinates (y = top of the text box). The baseline offset and the
+        // Y-flip are applied downstream (the line-builder positions baselines, the seam
+        // flips to PDF), so the element stays coordinate-system-blind.
+        return { width: wrapWidth, height: this.height };
+    }
+    /** The unwrapped single-line width of the content (used when width is unbounded, e.g. inside a Row).
+     *  Mirrors the renderer's advance EXACTLY: per-glyph, WITHOUT kerning. `getStringWidth` subtracts
+     *  kerning, so it under-reserves and the text would wrap inside its own natural-width box - the cause
+     *  of fixed Row children wrapping despite ample space. */
+    naturalWidth(metrics) {
+        const advance = (text, family, size, style) => {
+            let width = 0;
+            for (const ch of text)
+                width += metrics.getCharWidth(ch, size, undefined, family, style);
+            return width;
+        };
+        if (typeof this.content === "string") {
+            return advance(this.content, this.fontFamily, this.fontSize, this.fontStyle);
+        }
+        return this.content.reduce((sum, seg) => {
+            var _a, _b, _c;
+            return sum +
+                advance(seg.content, (_a = seg.fontFamily) !== null && _a !== void 0 ? _a : this.fontFamily, (_b = seg.fontSize) !== null && _b !== void 0 ? _b : this.fontSize, (_c = seg.fontStyle) !== null && _c !== void 0 ? _c : this.fontStyle);
+        }, 0);
+    }
+    getProps() {
+        return {
+            x: this.x,
+            y: this.y,
+            width: this.width,
+            height: this.height,
+            fontSize: this.fontSize,
+            fontFamily: this.fontFamily,
+            fontStyle: this.fontStyle,
+            color: this.color,
+            content: this.content,
+            textAlignment: this.textAlignment,
+        };
+    }
+}
+exports.TextElement = TextElement;

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./elements";
+export * from "./renderer";
+export * from "./api";

package/dist/index.js

@@ -0,0 +1,21 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./elements"), exports);
+__exportStar(require("./renderer"), exports);
+__exportStar(require("./api"), exports);
+// export * from './validator';
+// export * from './utils';