@effing/canvas 0.24.6 → 0.24.8

package/dist/index.js

@@ -260,12 +260,67 @@ function resolveTransformUnits(transform, viewportWidth, viewportHeight, fontSiz
 import { GlobalFonts } from "@napi-rs/canvas";
 
 // src/jsx/font-metrics.ts
-function parseFontMetrics(data) {
-  const buf = data instanceof ArrayBuffer ? data : data.buffer.slice(data.byteOffset, data.byteOffset + data.byteLength);
-  const view = new DataView(buf);
-  if (buf.byteLength < 12) return null;
+import { inflateSync } from "zlib";
+function fontMetricsToPx(metrics, fontSize) {
+  return {
+    ascent: metrics.ascender / metrics.unitsPerEm * fontSize,
+    descent: -metrics.descender / metrics.unitsPerEm * fontSize
+  };
+}
+var WOFF_SIGNATURE = 2001684038;
+function readWoffTable(view, entry) {
+  const compressed = entry.compLength < entry.origLength;
+  if (compressed) {
+    try {
+      const compData = new Uint8Array(
+        view.buffer,
+        view.byteOffset + entry.offset,
+        entry.compLength
+      );
+      const decompressed = inflateSync(compData);
+      return new DataView(
+        decompressed.buffer,
+        decompressed.byteOffset,
+        decompressed.byteLength
+      );
+    } catch {
+      return null;
+    }
+  }
+  return new DataView(
+    view.buffer,
+    view.byteOffset + entry.offset,
+    entry.origLength
+  );
+}
+function parseWoff(view) {
+  if (view.byteLength < 44) return null;
+  const numTables = view.getUint16(12);
+  if (view.byteLength < 44 + numTables * 20) return null;
+  let headEntry = null;
+  let hheaEntry = null;
+  for (let i = 0; i < numTables; i++) {
+    const r = 44 + i * 20;
+    const tag = String.fromCharCode(view.getUint8(r)) + String.fromCharCode(view.getUint8(r + 1)) + String.fromCharCode(view.getUint8(r + 2)) + String.fromCharCode(view.getUint8(r + 3));
+    const offset = view.getUint32(r + 4);
+    const compLength = view.getUint32(r + 8);
+    const origLength = view.getUint32(r + 12);
+    if (tag === "head") headEntry = { offset, compLength, origLength };
+    else if (tag === "hhea") hheaEntry = { offset, compLength, origLength };
+  }
+  if (!headEntry || !hheaEntry) return null;
+  const headView = readWoffTable(view, headEntry);
+  const hheaView = readWoffTable(view, hheaEntry);
+  if (!headView || !hheaView) return null;
+  if (headView.byteLength < 20 || hheaView.byteLength < 8) return null;
+  const unitsPerEm = headView.getUint16(18);
+  const ascender = hheaView.getInt16(4);
+  const descender = hheaView.getInt16(6);
+  return { unitsPerEm, ascender, descender };
+}
+function parseSfnt(view) {
   const numTables = view.getUint16(4);
-  if (buf.byteLength < 12 + numTables * 16) return null;
+  if (view.byteLength < 12 + numTables * 16) return null;
   let headOffset = -1;
   let hheaOffset = -1;
   for (let i = 0; i < numTables; i++) {
@@ -276,13 +331,23 @@ function parseFontMetrics(data) {
     else if (tag === "hhea") hheaOffset = offset;
   }
   if (headOffset < 0 || hheaOffset < 0) return null;
-  if (buf.byteLength < headOffset + 20) return null;
+  if (view.byteLength < headOffset + 20) return null;
   const unitsPerEm = view.getUint16(headOffset + 18);
-  if (buf.byteLength < hheaOffset + 8) return null;
+  if (view.byteLength < hheaOffset + 8) return null;
   const ascender = view.getInt16(hheaOffset + 4);
   const descender = view.getInt16(hheaOffset + 6);
   return { unitsPerEm, ascender, descender };
 }
+function parseFontMetrics(data) {
+  const buf = data instanceof ArrayBuffer ? data : data.buffer.slice(data.byteOffset, data.byteOffset + data.byteLength);
+  const view = new DataView(buf);
+  if (buf.byteLength < 12) return null;
+  const signature = view.getUint32(0);
+  if (signature === WOFF_SIGNATURE) {
+    return parseWoff(view);
+  }
+  return parseSfnt(view);
+}
 
 // src/jsx/font.ts
 var registeredFonts = /* @__PURE__ */ new Set();
@@ -299,10 +364,13 @@ function registerFont(font) {
   registeredFonts.add(key);
 }
 function getFontMetrics(family, weight, style) {
-  const exact = metricsCache.get(`${family}:${weight}:${style}`);
-  if (exact) return exact;
-  for (const [key, metrics] of metricsCache) {
-    if (key.startsWith(`${family}:`)) return metrics;
+  const families = family.split(",").map((f) => f.trim().replace(/^['"]|['"]$/g, ""));
+  for (const name of families) {
+    const exact = metricsCache.get(`${name}:${weight}:${style}`);
+    if (exact) return exact;
+    for (const [key, metrics] of metricsCache) {
+      if (key.startsWith(`${name}:`)) return metrics;
+    }
   }
   return null;
 }
@@ -412,8 +480,9 @@ function measureTrimMetrics(fontSize, fontFamily, fontWeight, fontStyle, lineHei
   let fontAscent;
   let fontDescent;
   if (fontMetrics) {
-    fontAscent = fontMetrics.ascender / fontMetrics.unitsPerEm * fontSize;
-    fontDescent = -fontMetrics.descender / fontMetrics.unitsPerEm * fontSize;
+    const px = fontMetricsToPx(fontMetrics, fontSize);
+    fontAscent = px.ascent;
+    fontDescent = px.descent;
   } else {
     fontAscent = refMetrics.fontBoundingBoxAscent ?? refMetrics.actualBoundingBoxAscent ?? fontSize * 0.8;
     fontDescent = refMetrics.fontBoundingBoxDescent ?? refMetrics.actualBoundingBoxDescent ?? fontSize * 0.2;
@@ -637,7 +706,8 @@ function layoutText(text, style, maxWidth, ctx, emojiEnabled) {
   let totalHeight = 0;
   let maxLineWidth = 0;
   const isAutoLineHeight = style.lineHeight === void 0 || style.lineHeight === "normal";
-  let lastMetrics;
+  const fontPx = fontMetrics ? fontMetricsToPx(fontMetrics, fontSize) : null;
+  let lastPositioningDescent;
   for (let i = 0; i < lines.length; i++) {
     const line = lines[i];
     const lineWidth = measure(line);
@@ -655,14 +725,16 @@ function layoutText(text, style, maxWidth, ctx, emojiEnabled) {
       fontStyle,
       ctx
     );
-    lastMetrics = metrics;
-    const contentHeight = metrics.ascent + metrics.descent;
-    let effectiveAscent = metrics.ascent;
-    let effectiveDescent = metrics.descent;
+    const positioningAscent = fontPx?.ascent ?? metrics.ascent;
+    const positioningDescent = fontPx?.descent ?? metrics.descent;
+    lastPositioningDescent = positioningDescent;
+    const contentHeight = positioningAscent + positioningDescent;
+    let effectiveAscent = positioningAscent;
+    let effectiveDescent = positioningDescent;
     if (isAutoLineHeight && contentHeight > lineHeightPx) {
       const scale = lineHeightPx / contentHeight;
-      effectiveAscent = metrics.ascent * scale;
-      effectiveDescent = metrics.descent * scale;
+      effectiveAscent = positioningAscent * scale;
+      effectiveDescent = positioningDescent * scale;
     }
     const baselineY = totalHeight + (lineHeightPx + effectiveAscent - effectiveDescent) / 2;
     segments.push({
@@ -686,9 +758,9 @@ function layoutText(text, style, maxWidth, ctx, emojiEnabled) {
     totalHeight += lineHeightPx;
     maxLineWidth = Math.max(maxLineWidth, lineWidth);
   }
-  if (isAutoLineHeight && lastMetrics && segments.length > 0) {
+  if (isAutoLineHeight && lastPositioningDescent !== void 0 && segments.length > 0) {
     const lastSeg = segments[segments.length - 1];
-    const descentOverflow = lastSeg.y + lastMetrics.descent - totalHeight;
+    const descentOverflow = lastSeg.y + lastPositioningDescent - totalHeight;
     if (descentOverflow > 0) {
       totalHeight += descentOverflow;
     }
@@ -726,8 +798,8 @@ function layoutText(text, style, maxWidth, ctx, emojiEnabled) {
 function resolveLineHeight(lineHeight, fontSize, canvasMetrics, fontMetrics) {
   if (lineHeight === void 0 || lineHeight === "normal") {
     if (fontMetrics) {
-      const { ascender, descender, unitsPerEm } = fontMetrics;
-      return (ascender - descender) / unitsPerEm * fontSize;
+      const px = fontMetricsToPx(fontMetrics, fontSize);
+      return px.ascent + px.descent;
     }
     return canvasMetrics ? canvasMetrics.ascent + canvasMetrics.descent : fontSize * 1.2;
   }