pagyra-js 0.0.1

package/src/text/line-breaker.ts

@@ -0,0 +1,321 @@
+// ===== text/line-breaker.ts =====
+
+import { WhiteSpace } from "../css/enums.js";
+import { ComputedStyle } from "../css/style.js";
+import { estimateLineWidth, measureTextWithGlyphs } from "../layout/utils/text-metrics.js";
+import type { FontEmbedder } from "../pdf/font/embedder.js";
+import { applyTextTransform } from "./text-transform.js"; // Precisaremos exportar esta função
+
+// Representa uma unidade inquebrável (palavra) ou um espaço flexível (cola).
+export interface TextItem {
+  type: 'word' | 'space';
+  text: string;
+  width: number;
+}
+
+// O resultado da quebra de linha para um nó de texto.
+export interface LineBox {
+  text: string;
+  width: number;
+  spaceCount: number;
+  targetWidth: number;
+}
+
+/**
+ * Segmenta uma string de texto em palavras e espaços.
+ */
+function segmentText(text: string): { type: 'word' | 'space', text: string }[] {
+  // Uma segmentação simples baseada em espaços. Uma implementação mais robusta
+  // poderia usar Intl.Segmenter ou lidar com múltiplos tipos de espaços.
+  const segments: { type: 'word' | 'space', text: string }[] = [];
+  const regex = /(\s+)|([^\s]+)/g;
+  let match;
+  while ((match = regex.exec(text)) !== null) {
+    if (match[1]) { // É um espaço
+      segments.push({ type: 'space', text: match[1] });
+    } else if (match[2]) { // É uma palavra
+      segments.push({ type: 'word', text: match[2] });
+    }
+  }
+  return segments;
+}
+
+/**
+ * Mede a largura de cada palavra e espaço.
+ */
+function measureItems(
+  segments: { type: 'word' | 'space', text: string }[],
+  style: ComputedStyle,
+  fontEmbedder: FontEmbedder | null
+): TextItem[] {
+  const fontWeight = typeof style.fontWeight === "number" ? style.fontWeight : 400;
+  const fontStyle = style.fontStyle ?? "normal";
+  const fontMetrics = fontEmbedder?.getMetrics(style.fontFamily ?? "", fontWeight, fontStyle);
+
+  return segments.map(s => {
+    const glyphWidth = measureTextWithGlyphs(s.text, style, fontMetrics ?? null);
+    return {
+      ...s,
+      width: glyphWidth ?? estimateLineWidth(s.text, style),
+    };
+  });
+}
+
+function splitWordItem(
+  item: TextItem,
+  style: ComputedStyle,
+  availableWidth: number
+): TextItem[] {
+  if (availableWidth <= 0) {
+    return [item];
+  }
+  const pieces: TextItem[] = [];
+  let buffer = "";
+  let bufferWidth = 0;
+
+  const flush = () => {
+    if (!buffer) {
+      return;
+    }
+    pieces.push({ type: "word", text: buffer, width: bufferWidth });
+    buffer = "";
+    bufferWidth = 0;
+  };
+
+  for (const char of Array.from(item.text)) {
+    const candidate = buffer + char;
+    const candidateWidth = estimateLineWidth(candidate, style);
+
+    if (buffer && candidateWidth > availableWidth) {
+      flush();
+      buffer = char;
+      bufferWidth = estimateLineWidth(char, style);
+      continue;
+    }
+
+    if (!buffer && candidateWidth > availableWidth) {
+      pieces.push({ type: "word", text: char, width: candidateWidth });
+      buffer = "";
+      bufferWidth = 0;
+      continue;
+    }
+
+    buffer = candidate;
+    bufferWidth = candidateWidth;
+  }
+
+  flush();
+  return pieces.length ? pieces : [item];
+}
+
+function enforceOverflowWrap(
+  items: TextItem[],
+  style: ComputedStyle,
+  availableWidth: number,
+  mode: ComputedStyle["overflowWrap"] | undefined
+): TextItem[] {
+  if (!mode || mode === "normal") {
+    return items;
+  }
+
+  const adjusted: TextItem[] = [];
+  for (const item of items) {
+    if (item.type !== "word") {
+      adjusted.push(item);
+      continue;
+    }
+    if (item.width <= availableWidth) {
+      adjusted.push(item);
+      continue;
+    }
+    adjusted.push(...splitWordItem(item, style, availableWidth));
+  }
+
+  return adjusted.length ? adjusted : items;
+}
+
+function countJustifiableSpaces(items: TextItem[]): number {
+  let count = 0;
+  for (let index = 0; index < items.length; index++) {
+    const item = items[index];
+    if (item.type !== "space") {
+      continue;
+    }
+    const hasWordBefore = items.slice(0, index).some((candidate) => candidate.type === "word");
+    if (!hasWordBefore) {
+      continue;
+    }
+    const hasWordAfter = items.slice(index + 1).some((candidate) => candidate.type === "word");
+    if (hasWordAfter) {
+      count += 1;
+    }
+  }
+  return count;
+}
+
+function shouldTrimLineEdges(style: ComputedStyle): boolean {
+  const mode = style.whiteSpace;
+  return (
+    mode === WhiteSpace.Normal ||
+    mode === WhiteSpace.NoWrap ||
+    mode === WhiteSpace.PreLine
+  );
+}
+
+function buildLineBox(items: TextItem[], availableWidth: number, trimEdges: boolean): LineBox | null {
+  let start = 0;
+  let end = items.length;
+
+  if (trimEdges) {
+    while (start < end && items[start].type === "space") {
+      start += 1;
+    }
+    while (end > start && items[end - 1].type === "space") {
+      end -= 1;
+    }
+  }
+
+  if (start >= end) {
+    return null;
+  }
+
+  const trimmed = items.slice(start, end);
+  const text = trimmed.map((it) => it.text).join("");
+  const width = trimmed.reduce((sum, it) => sum + it.width, 0);
+
+  return {
+    text,
+    width,
+    spaceCount: countJustifiableSpaces(trimmed),
+    targetWidth: availableWidth,
+  };
+}
+
+/**
+ * Implementa um algoritmo de quebra de linha inspirado em Knuth-Plass
+ * usando programação dinâmica para encontrar o layout ótimo.
+ *
+ * @param text O texto a ser quebrado.
+ * @param style O estilo computado a ser usado para medição.
+ * @param availableWidth A largura disponível para o texto.
+ * @returns Um array de objetos LineBox representando as linhas ótimas.
+ */
+export function breakTextIntoLines(
+  text: string,
+  style: ComputedStyle,
+  availableWidth: number,
+  fontEmbedder: FontEmbedder | null = null
+): LineBox[] {
+  const effectiveText = applyTextTransform(text, style.textTransform);
+  if (effectiveText.length === 0) {
+    return [];
+  }
+
+  const rawItems = segmentText(effectiveText);
+  let items = measureItems(rawItems, style, fontEmbedder);
+  items = enforceOverflowWrap(items, style, availableWidth, style.overflowWrap);
+  const n = items.length;
+  if (n === 0) return [];
+  const trimEdges = shouldTrimLineEdges(style);
+
+  // Check if entire text fits on one line - if so, keep a single trimmed line
+  const totalWidth = items.reduce((sum, it) => sum + it.width, 0);
+  if (totalWidth <= availableWidth) {
+    const singleLine = buildLineBox(items, availableWidth, trimEdges);
+    return singleLine ? [singleLine] : [];
+  }
+
+  // memo[i] armazena o custo mínimo (feiura) para quebrar os primeiros `i` itens.
+  const memo: number[] = new Array(n + 1).fill(Infinity);
+  // breaks[i] armazena o índice do início da última linha na quebra ótima para os primeiros `i` itens.
+  const breaks: number[] = new Array(n + 1).fill(0);
+
+  memo[0] = 0;
+
+  for (let i = 1; i <= n; i++) {
+    let lineWidth = 0;
+    let hasWord = false;
+    for (let j = i; j > 0; j--) {
+      const item = items[j - 1];
+
+      if (item.type === "space") {
+        if (!hasWord && trimEdges) {
+          continue;
+        }
+        lineWidth += item.width;
+        if (lineWidth > availableWidth) {
+          break;
+        }
+        if (!trimEdges && !hasWord) {
+          const slack = availableWidth - lineWidth;
+          const cost = 100 + slack * slack;
+          if (memo[j - 1] + cost < memo[i]) {
+            memo[i] = memo[j - 1] + cost;
+            breaks[i] = j - 1;
+          }
+        }
+        continue;
+      }
+
+      lineWidth += item.width;
+      hasWord = true;
+
+      if (lineWidth > availableWidth) {
+        break; // Esta linha é longa demais, não há como continuar a partir deste `j`.
+      }
+
+      const slack = availableWidth - lineWidth;
+      const cost = 100 + slack * slack;
+
+      if (memo[j - 1] + cost < memo[i]) {
+        memo[i] = memo[j - 1] + cost;
+        breaks[i] = j - 1;
+      }
+    }
+  }
+
+  // Se memo[n] é infinito, significa que uma única palavra é mais larga que
+  // a linha, então recorremos a uma quebra forçada.
+  if (!isFinite(memo[n])) {
+    const lines: LineBox[] = [];
+    let currentWidth = 0;
+    let currentItems: TextItem[] = [];
+    const pushCurrent = () => {
+      const line = buildLineBox(currentItems, availableWidth, trimEdges);
+      if (line) {
+        lines.push(line);
+      }
+    };
+  for (const item of items) {
+    if (trimEdges && item.type === "space" && currentItems.length === 0) {
+      continue;
+    }
+    if (item.type === 'word' && currentItems.length > 0 && currentWidth + item.width > availableWidth) {
+      pushCurrent();
+      currentWidth = 0;
+      currentItems = [];
+    }
+    currentItems.push(item);
+    currentWidth += item.width;
+  }
+    if (currentItems.length > 0) {
+      pushCurrent();
+    }
+    return lines;
+  }
+  
+  // Reconstitui o caminho ótimo usando os backpointers em `breaks`.
+  const lines: LineBox[] = [];
+  let current = n;
+  while (current > 0) {
+    const prev = breaks[current];
+    const lineItems = items.slice(prev, current);
+    const line = buildLineBox(lineItems, availableWidth, trimEdges);
+    if (line) {
+      lines.unshift(line);
+    }
+    current = prev;
+  }
+
+  return lines;
+}

package/src/text/text-transform.ts

@@ -0,0 +1,43 @@
+import type { TextTransform } from "../css/style.js";
+
+const LETTER_OR_NUMBER = /[\p{L}\p{N}]/u;
+const DEFAULT_LOCALE = "en-US";
+
+function capitalizeText(text: string): string {
+  let result = "";
+  let capitalizeNext = true;
+
+  for (const char of text) {
+    if (LETTER_OR_NUMBER.test(char)) {
+      if (capitalizeNext) {
+        result += char.toLocaleUpperCase(DEFAULT_LOCALE);
+        capitalizeNext = false;
+      } else {
+        result += char.toLocaleLowerCase(DEFAULT_LOCALE);
+      }
+      continue;
+    }
+
+    capitalizeNext = true;
+    result += char;
+  }
+
+  return result;
+}
+
+export function applyTextTransform(text: string, transform?: TextTransform): string {
+  if (!text || !transform || transform === "none") {
+    return text;
+  }
+
+  switch (transform) {
+    case "uppercase":
+      return text.toLocaleUpperCase(DEFAULT_LOCALE);
+    case "lowercase":
+      return text.toLocaleLowerCase(DEFAULT_LOCALE);
+    case "capitalize":
+      return capitalizeText(text);
+    default:
+      return text;
+  }
+}

package/src/text/text.ts

@@ -0,0 +1,33 @@
+/* The UNICODE_TO_WIN_ANSI map is defined in pdf/utils/encoding.ts */
+import { UNICODE_TO_WIN_ANSI } from "../pdf/utils/encoding.js";
+
+export function needsUnicode(text: string): boolean {
+  for (const ch of Array.from(text)) {
+    const cp = ch.codePointAt(0)!;
+    if (!UNICODE_TO_WIN_ANSI.has(cp)) return true; // ✓ ★, combining, etc.
+  }
+  return false;
+}
+
+// Extend Intl type for Segmenter
+declare global {
+  namespace Intl {
+    class Segmenter {
+      constructor(locales?: string | string[], options?: any);
+      segment(input: string): any;
+    }
+  }
+}
+
+// @ts-ignore: Intl.Segmenter may not be available in older environments
+export function normalizeAndSegment(text: string): string[] {
+  const normalized = text.normalize("NFC");
+  // Fallback for environments without Intl.Segmenter
+  if (typeof Intl !== "undefined" && Intl.Segmenter) {
+    const seg = new Intl.Segmenter("pt", { granularity: "grapheme" });
+    return [...seg.segment(normalized)].map(s => s.segment);
+  } else {
+    // Simple grapheme splitting by character (not perfect but better than nothing)
+    return Array.from(normalized);
+  }
+}

package/src/transform/css-parser.ts

@@ -0,0 +1,95 @@
+import { identityMatrix, multiplyMatrices } from "../geometry/matrix.js";
+import type { Matrix } from "../geometry/matrix.js";
+
+/**
+ * Parse CSS/SVG transform string into a Matrix using the SVG convention.
+ * This parser follows the SVG/CSS syntax and semantics and does NOT adapt
+ * the resulting matrix to any target coordinate system (e.g., PDF).
+ *
+ * Returned matrix components are in the same units as the input values
+ * (typically px for translate).
+ */
+export function parseTransform(raw: string | undefined): Matrix | null {
+  if (!raw) {
+    return null;
+  }
+  const regex = /([a-zA-Z]+)\(([^)]*)\)/g;
+  let match: RegExpExecArray | null;
+  let current = identityMatrix();
+  let found = false;
+  while ((match = regex.exec(raw)) !== null) {
+    const type = match[1].toLowerCase();
+    const params = parseNumberList(match[2]);
+    const matrix = transformFromValues(type, params);
+    if (matrix) {
+      current = multiplyMatrices(current, matrix);
+      found = true;
+    }
+  }
+  return found ? current : null;
+}
+
+function transformFromValues(type: string, values: number[]): Matrix | null {
+  switch (type) {
+    case "matrix":
+      if (values.length >= 6) {
+        return {
+          a: values[0],
+          b: values[1],
+          c: values[2],
+          d: values[3],
+          e: values[4],
+          f: values[5],
+        };
+      }
+      return null;
+    case "translate": {
+      const tx = Number.isFinite(values[0]) ? values[0] : 0;
+      const ty = Number.isFinite(values[1]) ? values[1] : 0;
+      return { a: 1, b: 0, c: 0, d: 1, e: tx, f: ty };
+    }
+    case "scale": {
+      const sx = Number.isFinite(values[0]) ? values[0] : 1;
+      const sy = Number.isFinite(values[1]) ? values[1] : sx;
+      return { a: sx, b: 0, c: 0, d: sy, e: 0, f: 0 };
+    }
+    case "rotate": {
+      // SVG rotate(angle [, cx, cy])
+      const angle = (Number.isFinite(values[0]) ? values[0] : 0) * (Math.PI / 180);
+      const cos = Math.cos(angle);
+      const sin = Math.sin(angle);
+      let base: Matrix = { a: cos, b: sin, c: -sin, d: cos, e: 0, f: 0 };
+      if (values.length >= 3 && Number.isFinite(values[1]) && Number.isFinite(values[2])) {
+        const cx = values[1];
+        const cy = values[2];
+        const translateTo: Matrix = { a: 1, b: 0, c: 0, d: 1, e: cx, f: cy };
+        const translateBack: Matrix = { a: 1, b: 0, c: 0, d: 1, e: -cx, f: -cy };
+        base = multiplyMatrices(translateTo, multiplyMatrices(base, translateBack));
+      }
+      return base;
+    }
+    case "skewx": {
+      const angle = (Number.isFinite(values[0]) ? values[0] : 0) * (Math.PI / 180);
+      return { a: 1, b: 0, c: Math.tan(angle), d: 1, e: 0, f: 0 };
+    }
+    case "skewy": {
+      const angle = (Number.isFinite(values[0]) ? values[0] : 0) * (Math.PI / 180);
+      return { a: 1, b: Math.tan(angle), c: 0, d: 1, e: 0, f: 0 };
+    }
+    default:
+      return null;
+  }
+}
+
+function parseNumberList(value: string): number[] {
+  const result: number[] = [];
+  const regex = /[-+]?(?:\d+\.?\d*|\.\d+)(?:[eE][-+]?\d+)?/g;
+  let match: RegExpExecArray | null;
+  while ((match = regex.exec(value)) !== null) {
+    const parsed = Number.parseFloat(match[0]);
+    if (Number.isFinite(parsed)) {
+      result.push(parsed);
+    }
+  }
+  return result;
+}

package/src/types/fonts.ts

@@ -0,0 +1,62 @@
+export interface FontConfig {
+  readonly fontFaceDefs: FontFaceDef[];
+  readonly defaultStack: string[];
+}
+
+export interface FontFaceDef {
+  readonly name: string;
+  readonly family: string;
+  readonly weight: number;
+  readonly style: 'normal' | 'italic';
+  readonly src: string; // path to TTF file
+  readonly data?: ArrayBuffer;
+}
+
+export interface TtfMetrics {
+  readonly unitsPerEm: number;
+  readonly ascender: number;
+  readonly descender: number;
+  readonly lineGap: number;
+  readonly capHeight: number;
+  readonly xHeight: number;
+}
+
+export interface GlyphMetrics {
+  readonly advanceWidth: number;
+  readonly leftSideBearing: number;
+}
+
+export type KerningMap = Map<number, Map<number, number>>;
+
+export interface CmapData {
+  readonly getGlyphId: (codePoint: number) => number;
+  readonly hasCodePoint: (codePoint: number) => boolean;
+  readonly unicodeMap: Map<number, number>; // Internal access for CMap generation
+}
+
+export type GlyphOutlineCmd =
+  | { type: "moveTo"; x: number; y: number }
+  | { type: "lineTo"; x: number; y: number }
+  | { type: "quadTo"; cx: number; cy: number; x: number; y: number } // quadratic Bézier
+  | { type: "cubicTo"; cx1: number; cy1: number; cx2: number; cy2: number; x: number; y: number } // cubic Bézier
+  | { type: "close" };
+
+export class TtfFontMetrics {
+  constructor(
+    public readonly metrics: TtfMetrics,
+    public readonly glyphMetrics: Map<number, GlyphMetrics>,
+    public readonly cmap: CmapData,
+    // optional head bbox in font units [xMin, yMin, xMax, yMax]
+    public readonly headBBox?: readonly [number, number, number, number],
+    /**
+     * Optional hook that returns a glyph's outline command sequence.
+     * Present to prepare the API for future glyf / CFF parsing; placeholder
+     * implementations should return null when outlines aren't available.
+     */
+    public readonly getGlyphOutline?: (gid: number) => GlyphOutlineCmd[] | null,
+    /**
+     * Optional kerning map (left GID -> right GID -> adjustment in font units).
+     */
+    public readonly kerning?: KerningMap
+  ) {}
+}

package/src/types/public.ts

@@ -0,0 +1,19 @@
+export interface ViewportPx { width: number; height: number; }
+export interface PageMarginsPx { top: number; right: number; bottom: number; left: number; }
+
+export interface RenderHtmlOptions {
+  html: string;
+  css?: string;
+  viewport: ViewportPx;
+  page: { widthPx: number; heightPx: number; marginsPx: PageMarginsPx };
+  debug?: { level?: 'trace'|'debug'|'info'|'warn'|'error'; cats?: string[] };
+  fontConfig?: unknown;           // keep your current type if you have one
+  resourceBaseDir?: string;
+  assetRootDir?: string;
+}
+
+export interface PreparedRender {
+  layoutRoot: unknown;            // use your LayoutNode
+  renderTree: unknown;            // use your RenderTree
+  pageSizePt: { width: number; height: number };
+}

package/src/units/page-utils.ts

@@ -0,0 +1,58 @@
+// src/units/page-utils.ts
+
+import { ptToPx } from "./units.js";
+
+export interface PageMarginsPx {
+  top: number;
+  right: number;
+  bottom: number;
+  left: number;
+}
+
+export const DEFAULT_PAGE_SIZE_PT = { width: 595.28, height: 841.89 };
+export const DEFAULT_PAGE_MARGINS_PT = { top: 36, right: 36, bottom: 36, left: 36 };
+
+export const DEFAULT_PAGE_WIDTH_PX = ptToPx(DEFAULT_PAGE_SIZE_PT.width);
+export const DEFAULT_PAGE_HEIGHT_PX = ptToPx(DEFAULT_PAGE_SIZE_PT.height);
+
+export const DEFAULT_PAGE_MARGINS_PX = {
+  top: ptToPx(DEFAULT_PAGE_MARGINS_PT.top),
+  right: ptToPx(DEFAULT_PAGE_MARGINS_PT.right),
+  bottom: ptToPx(DEFAULT_PAGE_MARGINS_PT.bottom),
+  left: ptToPx(DEFAULT_PAGE_MARGINS_PT.left),
+};
+
+export function resolvePageMarginsPx(pageWidthPx: number, pageHeightPx: number): PageMarginsPx {
+  // ... (implementation from html-to-pdf.ts)
+  const margins = { ...DEFAULT_PAGE_MARGINS_PX };
+  const horizontalSum = margins.left + margins.right;
+  const verticalSum = margins.top + margins.bottom;
+  const usableWidth = maxContentDimension(pageWidthPx, 0);
+  const usableHeight = maxContentDimension(pageHeightPx, 0);
+
+  if (horizontalSum > usableWidth) {
+    const scale = usableWidth / (horizontalSum || 1);
+    margins.left *= scale;
+    margins.right *= scale;
+  }
+  if (verticalSum > usableHeight) {
+    const scale = usableHeight / (verticalSum || 1);
+    margins.top *= scale;
+    margins.bottom *= scale;
+  }
+  return margins;
+}
+
+export function sanitizeDimension(value: number | undefined, fallback: number): number {
+  // ... (implementation from html-to-pdf.ts)
+  if (!Number.isFinite(value ?? NaN)) {
+    return fallback;
+  }
+  const sanitized = Number(value);
+  return sanitized > 0 ? sanitized : fallback;
+}
+
+export function maxContentDimension(total: number, marginsSum: number): number {
+  // ... (implementation from html-to-pdf.ts)
+  return Math.max(1, total - marginsSum);
+}

package/src/units/units.ts

@@ -0,0 +1,50 @@
+// src/units/units.ts
+
+import { parseLength, parseLengthOrPercent } from "../css/parsers/length-parser.js";
+
+const DPI = 96;
+const INCHES_PER_CM = 1 / 2.54;
+
+export function cmToPx(cm: number): number {
+  return cm * INCHES_PER_CM * DPI;
+}
+
+export function mmToPx(mm: number): number {
+  return (mm / 10) * INCHES_PER_CM * DPI;
+}
+
+export function qToPx(q: number): number {
+  return (q / 40) * INCHES_PER_CM * DPI;
+}
+
+export function inToPx(inches: number): number {
+  return inches * DPI;
+}
+
+export function pcToPx(pc: number): number {
+  return pc * (DPI / 6);
+}
+
+export function ptToPx(pt: number): number {
+  return pt * (DPI / 72);
+}
+
+export function pxToPt(px: number): number {
+  return px * (72 / DPI);
+}
+
+export interface UnitCtx {
+  viewport: {
+    width: number;
+    height: number;
+  };
+}
+
+export function makeUnitParsers(ctx: UnitCtx) {
+  return {
+    parseLength: (value: string) => parseLength(value),
+    parseLengthOrPercent: (value: string) => parseLengthOrPercent(value),
+  };
+}
+
+export type UnitParsers = ReturnType<typeof makeUnitParsers>;