pptx-glimpse 0.2.1 → 0.3.0

package/README.md

@@ -2,9 +2,11 @@
 
 [![npm](https://img.shields.io/npm/v/pptx-glimpse)](https://www.npmjs.com/package/pptx-glimpse)
 
-A Node.js library to render PPTX as SVG / PNG.
+A lightweight JavaScript library for rendering PowerPoint (.pptx) files as SVG or PNG in Node.js. No LibreOffice required.
 
-[Demo](https://pptx-glimpse.vercel.app/) | [npm](https://www.npmjs.com/package/pptx-glimpse)
+**[Try the Demo](https://pptx-glimpse.vercel.app/)** | [npm](https://www.npmjs.com/package/pptx-glimpse)
+
+![pptx-glimpse demo](https://raw.githubusercontent.com/hirokisakabe/pptx-glimpse/main/docs/demo.gif)
 
 ## Motivation
 

package/dist/index.cjs

@@ -35,6 +35,8 @@ __export(index_exports, {
   convertPptxToPng: () => convertPptxToPng,
   convertPptxToSvg: () => convertPptxToSvg,
   createFontMapping: () => createFontMapping,
+  createOpentypeSetupFromBuffers: () => createOpentypeSetupFromBuffers,
+  createOpentypeTextMeasurerFromBuffers: () => createOpentypeTextMeasurerFromBuffers,
   getMappedFont: () => getMappedFont,
   getWarningEntries: () => getWarningEntries,
   getWarningSummary: () => getWarningSummary
@@ -3813,6 +3815,65 @@ function renderPlaceholder(mimeType, w, h, transformAttr) {
   ].join("");
 }
 
+// src/warning-logger.ts
+var PREFIX = "[pptx-glimpse]";
+var currentLevel = "off";
+var entries = [];
+var featureCounts = /* @__PURE__ */ new Map();
+function initWarningLogger(level) {
+  currentLevel = level;
+  entries = [];
+  featureCounts.clear();
+}
+function warn(feature, message, context) {
+  if (currentLevel === "off") return;
+  entries.push({ feature, message, ...context !== void 0 && { context } });
+  const existing = featureCounts.get(feature);
+  if (existing) {
+    existing.count++;
+  } else {
+    featureCounts.set(feature, { message, count: 1 });
+  }
+  if (currentLevel === "debug") {
+    const ctx = context ? ` (${context})` : "";
+    console.warn(`${PREFIX} SKIP: ${feature} - ${message}${ctx}`);
+  }
+}
+function debug(feature, message, context) {
+  if (currentLevel !== "debug") return;
+  entries.push({ feature, message, ...context !== void 0 && { context } });
+  const existing = featureCounts.get(feature);
+  if (existing) {
+    existing.count++;
+  } else {
+    featureCounts.set(feature, { message, count: 1 });
+  }
+  const ctx = context ? ` (${context})` : "";
+  console.warn(`${PREFIX} DEBUG: ${feature} - ${message}${ctx}`);
+}
+function getWarningSummary() {
+  const features = [];
+  for (const [feature, { message, count }] of featureCounts) {
+    features.push({ feature, message, count });
+  }
+  return { totalCount: entries.length, features };
+}
+function flushWarnings() {
+  const summary = getWarningSummary();
+  if (currentLevel !== "off" && summary.features.length > 0) {
+    console.warn(`${PREFIX} Summary: ${summary.features.length} unsupported feature(s) detected`);
+    for (const { feature, count } of summary.features) {
+      console.warn(`  - ${feature}: ${count} occurrence(s)`);
+    }
+  }
+  entries = [];
+  featureCounts.clear();
+  return summary;
+}
+function getWarningEntries() {
+  return entries;
+}
+
 // src/renderer/chart-renderer.ts
 var DEFAULT_SERIES_COLORS = [
   { hex: "#4472C4", alpha: 1 },
@@ -3894,11 +3955,20 @@ function renderChartTitle(title, chartWidth) {
 function renderBarChart(chart, x, y, w, h) {
   const parts = [];
   const { series, categories } = chart;
-  if (series.length === 0) return "";
+  if (series.length === 0) {
+    debug("chart.bar", "series is empty");
+    return "";
+  }
   const maxVal = getMaxValue(series);
-  if (maxVal === 0) return "";
+  if (maxVal === 0) {
+    debug("chart.bar", "max value is 0");
+    return "";
+  }
   const catCount = categories.length || Math.max(...series.map((s) => s.values.length));
-  if (catCount === 0) return "";
+  if (catCount === 0) {
+    debug("chart.bar", "category count is 0");
+    return "";
+  }
   const isHorizontal = chart.barDirection === "bar";
   parts.push(
     `<line x1="${round3(x)}" y1="${round3(y + h)}" x2="${round3(x + w)}" y2="${round3(y + h)}" stroke="#D9D9D9" stroke-width="1"/>`
@@ -3958,11 +4028,20 @@ function renderBarChart(chart, x, y, w, h) {
 function renderLineChart(chart, x, y, w, h) {
   const parts = [];
   const { series, categories } = chart;
-  if (series.length === 0) return "";
+  if (series.length === 0) {
+    debug("chart.line", "series is empty");
+    return "";
+  }
   const maxVal = getMaxValue(series);
-  if (maxVal === 0) return "";
+  if (maxVal === 0) {
+    debug("chart.line", "max value is 0");
+    return "";
+  }
   const catCount = categories.length || Math.max(...series.map((s) => s.values.length));
-  if (catCount === 0) return "";
+  if (catCount === 0) {
+    debug("chart.line", "category count is 0");
+    return "";
+  }
   parts.push(
     `<line x1="${round3(x)}" y1="${round3(y + h)}" x2="${round3(x + w)}" y2="${round3(y + h)}" stroke="#D9D9D9" stroke-width="1"/>`
   );
@@ -3998,11 +4077,20 @@ function renderLineChart(chart, x, y, w, h) {
 function renderAreaChart(chart, x, y, w, h) {
   const parts = [];
   const { series, categories } = chart;
-  if (series.length === 0) return "";
+  if (series.length === 0) {
+    debug("chart.area", "series is empty");
+    return "";
+  }
   const maxVal = getMaxValue(series);
-  if (maxVal === 0) return "";
+  if (maxVal === 0) {
+    debug("chart.area", "max value is 0");
+    return "";
+  }
   const catCount = categories.length || Math.max(...series.map((s) => s.values.length));
-  if (catCount === 0) return "";
+  if (catCount === 0) {
+    debug("chart.area", "category count is 0");
+    return "";
+  }
   parts.push(
     `<line x1="${round3(x)}" y1="${round3(y + h)}" x2="${round3(x + w)}" y2="${round3(y + h)}" stroke="#D9D9D9" stroke-width="1"/>`
   );
@@ -4039,9 +4127,15 @@ function renderAreaChart(chart, x, y, w, h) {
 function renderPieChart(chart, x, y, w, h) {
   const parts = [];
   const series = chart.series[0];
-  if (!series || series.values.length === 0) return "";
+  if (!series || series.values.length === 0) {
+    debug("chart.pie", "series is empty or has no values");
+    return "";
+  }
   const total = series.values.reduce((sum, v) => sum + v, 0);
-  if (total === 0) return "";
+  if (total === 0) {
+    debug("chart.pie", "total value is 0");
+    return "";
+  }
   const cx = x + w / 2;
   const cy = y + h / 2;
   const r = Math.min(w, h) / 2 * 0.85;
@@ -4071,9 +4165,15 @@ function renderPieChart(chart, x, y, w, h) {
 function renderDoughnutChart(chart, x, y, w, h) {
   const parts = [];
   const series = chart.series[0];
-  if (!series || series.values.length === 0) return "";
+  if (!series || series.values.length === 0) {
+    debug("chart.doughnut", "series is empty or has no values");
+    return "";
+  }
   const total = series.values.reduce((sum, v) => sum + v, 0);
-  if (total === 0) return "";
+  if (total === 0) {
+    debug("chart.doughnut", "total value is 0");
+    return "";
+  }
   const cx = x + w / 2;
   const cy = y + h / 2;
   const outerR = Math.min(w, h) / 2 * 0.85;
@@ -4112,7 +4212,10 @@ function renderDoughnutChart(chart, x, y, w, h) {
 function renderScatterChart(chart, x, y, w, h) {
   const parts = [];
   const { series } = chart;
-  if (series.length === 0) return "";
+  if (series.length === 0) {
+    debug("chart.scatter", "series is empty");
+    return "";
+  }
   let maxX = 0;
   let maxY = 0;
   for (const s of series) {
@@ -4144,7 +4247,10 @@ function renderScatterChart(chart, x, y, w, h) {
 function renderBubbleChart(chart, x, y, w, h) {
   const parts = [];
   const { series } = chart;
-  if (series.length === 0) return "";
+  if (series.length === 0) {
+    debug("chart.bubble", "series is empty");
+    return "";
+  }
   let maxX = 0;
   let maxY = 0;
   let maxBubble = 0;
@@ -4186,11 +4292,20 @@ function renderBubbleChart(chart, x, y, w, h) {
 function renderRadarChart(chart, x, y, w, h) {
   const parts = [];
   const { series, categories } = chart;
-  if (series.length === 0) return "";
+  if (series.length === 0) {
+    debug("chart.radar", "series is empty");
+    return "";
+  }
   const maxVal = getMaxValue(series);
-  if (maxVal === 0) return "";
+  if (maxVal === 0) {
+    debug("chart.radar", "max value is 0");
+    return "";
+  }
   const catCount = categories.length || Math.max(...series.map((s) => s.values.length));
-  if (catCount === 0) return "";
+  if (catCount === 0) {
+    debug("chart.radar", "category count is 0");
+    return "";
+  }
   const cx = x + w / 2;
   const cy = y + h / 2;
   const radius = Math.min(w, h) / 2 * 0.85;
@@ -4254,12 +4369,18 @@ function renderRadarChart(chart, x, y, w, h) {
 function renderStockChart(chart, x, y, w, h) {
   const parts = [];
   const { series, categories } = chart;
-  if (series.length < 3) return "";
+  if (series.length < 3) {
+    debug("chart.stock", `insufficient series count: ${series.length} (need at least 3)`);
+    return "";
+  }
   const highSeries = series[0];
   const lowSeries = series[1];
   const closeSeries = series[2];
   const catCount = categories.length || highSeries.values.length;
-  if (catCount === 0) return "";
+  if (catCount === 0) {
+    debug("chart.stock", "category count is 0");
+    return "";
+  }
   let maxVal = 0;
   let minVal = Infinity;
   for (const s of [highSeries, lowSeries, closeSeries]) {
@@ -4268,7 +4389,10 @@ function renderStockChart(chart, x, y, w, h) {
       minVal = Math.min(minVal, v);
     }
   }
-  if (maxVal === minVal) return "";
+  if (maxVal === minVal) {
+    debug("chart.stock", "max equals min value");
+    return "";
+  }
   parts.push(
     `<line x1="${round3(x)}" y1="${round3(y + h)}" x2="${round3(x + w)}" y2="${round3(y + h)}" stroke="#D9D9D9" stroke-width="1"/>`
   );
@@ -4304,10 +4428,16 @@ function renderStockChart(chart, x, y, w, h) {
 function renderSurfaceChart(chart, x, y, w, h) {
   const parts = [];
   const { series, categories } = chart;
-  if (series.length === 0) return "";
+  if (series.length === 0) {
+    debug("chart.surface", "series is empty");
+    return "";
+  }
   const rows = series.length;
   const cols = categories.length || Math.max(...series.map((s) => s.values.length));
-  if (cols === 0) return "";
+  if (cols === 0) {
+    debug("chart.surface", "column count is 0");
+    return "";
+  }
   let minVal = Infinity;
   let maxVal = -Infinity;
   for (const s of series) {
@@ -4380,9 +4510,15 @@ function heatmapColor(t) {
 function renderOfPieChart(chart, x, y, w, h) {
   const parts = [];
   const series = chart.series[0];
-  if (!series || series.values.length === 0) return "";
+  if (!series || series.values.length === 0) {
+    debug("chart.ofPie", "series is empty or has no values");
+    return "";
+  }
   const total = series.values.reduce((sum, v) => sum + v, 0);
-  if (total === 0) return "";
+  if (total === 0) {
+    debug("chart.ofPie", "total value is 0");
+    return "";
+  }
   const splitPos = chart.splitPos ?? 2;
   const secondPieSize = chart.secondPieSize ?? 75;
   const isBarOfPie = chart.ofPieType === "bar";
@@ -4747,65 +4883,6 @@ async function svgToPng(svgString, options) {
   return { png: result.data, width: result.info.width, height: result.info.height };
 }
 
-// src/warning-logger.ts
-var PREFIX = "[pptx-glimpse]";
-var currentLevel = "off";
-var entries = [];
-var featureCounts = /* @__PURE__ */ new Map();
-function initWarningLogger(level) {
-  currentLevel = level;
-  entries = [];
-  featureCounts.clear();
-}
-function warn(feature, message, context) {
-  if (currentLevel === "off") return;
-  entries.push({ feature, message, ...context !== void 0 && { context } });
-  const existing = featureCounts.get(feature);
-  if (existing) {
-    existing.count++;
-  } else {
-    featureCounts.set(feature, { message, count: 1 });
-  }
-  if (currentLevel === "debug") {
-    const ctx = context ? ` (${context})` : "";
-    console.warn(`${PREFIX} SKIP: ${feature} - ${message}${ctx}`);
-  }
-}
-function debug(feature, message, context) {
-  if (currentLevel !== "debug") return;
-  entries.push({ feature, message, ...context !== void 0 && { context } });
-  const existing = featureCounts.get(feature);
-  if (existing) {
-    existing.count++;
-  } else {
-    featureCounts.set(feature, { message, count: 1 });
-  }
-  const ctx = context ? ` (${context})` : "";
-  console.warn(`${PREFIX} DEBUG: ${feature} - ${message}${ctx}`);
-}
-function getWarningSummary() {
-  const features = [];
-  for (const [feature, { message, count }] of featureCounts) {
-    features.push({ feature, message, count });
-  }
-  return { totalCount: entries.length, features };
-}
-function flushWarnings() {
-  const summary = getWarningSummary();
-  if (currentLevel !== "off" && summary.features.length > 0) {
-    console.warn(`${PREFIX} Summary: ${summary.features.length} unsupported feature(s) detected`);
-    for (const { feature, count } of summary.features) {
-      console.warn(`  - ${feature}: ${count} occurrence(s)`);
-    }
-  }
-  entries = [];
-  featureCounts.clear();
-  return summary;
-}
-function getWarningEntries() {
-  return entries;
-}
-
 // src/parser/pptx-reader.ts
 var import_fflate = require("fflate");
 function readPptx(input) {
@@ -6183,10 +6260,16 @@ function parseCustomGeometry(custGeom) {
   for (const path of paths) {
     const w = Number(path["@_w"] ?? 0);
     const h = Number(path["@_h"] ?? 0);
-    if (w === 0 && h === 0) continue;
+    if (w === 0 && h === 0) {
+      debug("custGeom.path", "path skipped: width and height are both 0");
+      continue;
+    }
     const vars = evaluateGuides(avGd, gdGd, w, h);
     const commands = buildPathCommands(path, vars);
-    if (!commands) continue;
+    if (!commands) {
+      debug("custGeom.path", "path skipped: failed to build path commands");
+      continue;
+    }
     result.push({ width: w, height: h, commands });
   }
   return result.length > 0 ? result : null;
@@ -6759,7 +6842,10 @@ function parseImage(pic, rels, slidePath, archive, colorResolver) {
   if (!rel) return null;
   const mediaPath = resolveRelationshipTarget(slidePath, rel.target);
   const mediaData = archive.media.get(mediaPath);
-  if (!mediaData) return null;
+  if (!mediaData) {
+    debug("picture.media", `media file not found: ${mediaPath}`);
+    return null;
+  }
   const ext = mediaPath.split(".").pop()?.toLowerCase() ?? "png";
   const mimeMap = {
     png: "image/png",
@@ -6958,9 +7044,15 @@ function parseSmartArt(graphicData, transform, rels, slidePath, archive, colorRe
       }
     }
   }
-  if (!drawingPath) return null;
+  if (!drawingPath) {
+    debug("smartArt.drawing", "diagramDrawing relationship not found");
+    return null;
+  }
   const drawingXml = archive.files.get(drawingPath);
-  if (!drawingXml) return null;
+  if (!drawingXml) {
+    debug("smartArt.drawing", `drawing XML not found in archive: ${drawingPath}`);
+    return null;
+  }
   const parsed = parseXml(drawingXml);
   const drawing = parsed.drawing;
   const spTree = drawing?.spTree;
@@ -8020,6 +8112,108 @@ function collectFontFilePaths(additionalDirs) {
   return result;
 }
 
+// src/font/ttc-parser.ts
+var TTC_TAG = 1953784678;
+function isTtcBuffer(data) {
+  const view = toDataView(data);
+  if (view.byteLength < 4) return false;
+  return view.getUint32(0) === TTC_TAG;
+}
+function extractTtcFonts(data) {
+  const view = toDataView(data);
+  const bytes = toUint8Array(data);
+  if (view.byteLength < 12) return [];
+  if (view.getUint32(0) !== TTC_TAG) return [];
+  const numFonts = view.getUint32(8);
+  if (numFonts === 0) return [];
+  const headerEnd = 12 + numFonts * 4;
+  if (view.byteLength < headerEnd) return [];
+  const results = [];
+  for (let i = 0; i < numFonts; i++) {
+    try {
+      const fontOffset = view.getUint32(12 + i * 4);
+      const extracted = extractSingleFont(view, bytes, fontOffset);
+      if (extracted) results.push(extracted);
+    } catch {
+    }
+  }
+  return results;
+}
+function extractSingleFont(view, bytes, fontOffset) {
+  if (fontOffset + 12 > view.byteLength) return null;
+  const sfVersion = view.getUint32(fontOffset);
+  const numTables = view.getUint16(fontOffset + 4);
+  if (numTables === 0) return null;
+  const tableRecordsStart = fontOffset + 12;
+  const tableRecordsEnd = tableRecordsStart + numTables * 16;
+  if (tableRecordsEnd > view.byteLength) return null;
+  const tables = [];
+  for (let i = 0; i < numTables; i++) {
+    const recOffset = tableRecordsStart + i * 16;
+    const tableOffset = view.getUint32(recOffset + 8);
+    const tableLength = view.getUint32(recOffset + 12);
+    if (tableOffset > view.byteLength || tableLength > view.byteLength - tableOffset) {
+      return null;
+    }
+    tables.push({
+      tag: view.getUint32(recOffset),
+      checkSum: view.getUint32(recOffset + 4),
+      offset: tableOffset,
+      length: tableLength
+    });
+  }
+  const headerSize = 12 + numTables * 16;
+  let dataSize = 0;
+  for (const table of tables) {
+    dataSize += alignTo4(table.length);
+  }
+  const totalSize = headerSize + dataSize;
+  const output = new ArrayBuffer(totalSize);
+  const outView = new DataView(output);
+  const outBytes = new Uint8Array(output);
+  outView.setUint32(0, sfVersion);
+  outView.setUint16(4, numTables);
+  const { searchRange, entrySelector, rangeShift } = calcOffsetTableFields(numTables);
+  outView.setUint16(6, searchRange);
+  outView.setUint16(8, entrySelector);
+  outView.setUint16(10, rangeShift);
+  let currentDataOffset = headerSize;
+  for (let i = 0; i < numTables; i++) {
+    const table = tables[i];
+    const recOffset = 12 + i * 16;
+    outView.setUint32(recOffset, table.tag);
+    outView.setUint32(recOffset + 4, table.checkSum);
+    outView.setUint32(recOffset + 8, currentDataOffset);
+    outView.setUint32(recOffset + 12, table.length);
+    outBytes.set(bytes.subarray(table.offset, table.offset + table.length), currentDataOffset);
+    currentDataOffset += alignTo4(table.length);
+  }
+  return output;
+}
+function alignTo4(n) {
+  return n + 3 & ~3;
+}
+function calcOffsetTableFields(numTables) {
+  let searchRange = 16;
+  let entrySelector = 0;
+  while (searchRange * 2 <= numTables * 16) {
+    searchRange *= 2;
+    entrySelector++;
+  }
+  const rangeShift = numTables * 16 - searchRange;
+  return { searchRange, entrySelector, rangeShift };
+}
+function toDataView(data) {
+  if (data instanceof Uint8Array) {
+    return new DataView(data.buffer, data.byteOffset, data.byteLength);
+  }
+  return new DataView(data);
+}
+function toUint8Array(data) {
+  if (data instanceof Uint8Array) return data;
+  return new Uint8Array(data);
+}
+
 // src/font/opentype-helpers.ts
 async function tryLoadOpentype() {
   try {
@@ -8046,6 +8240,63 @@ function toArrayBuffer(data) {
   if (data instanceof ArrayBuffer) return data;
   return data.buffer.slice(data.byteOffset, data.byteOffset + data.byteLength);
 }
+function parseFontBuffer(arrayBuffer, opentype) {
+  if (isTtcBuffer(arrayBuffer)) {
+    const results = [];
+    for (const buf of extractTtcFonts(arrayBuffer)) {
+      try {
+        results.push(opentype.parse(buf));
+      } catch {
+      }
+    }
+    return results;
+  }
+  return [opentype.parse(arrayBuffer)];
+}
+async function createOpentypeTextMeasurerFromBuffers(fontBuffers, fontMapping) {
+  const setup = await createOpentypeSetupFromBuffers(fontBuffers, fontMapping);
+  return setup?.measurer ?? null;
+}
+async function createOpentypeSetupFromBuffers(fontBuffers, fontMapping) {
+  if (fontBuffers.length === 0) return null;
+  const opentype = await tryLoadOpentype();
+  if (!opentype) return null;
+  const mapping = createFontMapping(fontMapping);
+  const reverseMap = buildReverseMapping(mapping);
+  const measurerFonts = /* @__PURE__ */ new Map();
+  const resolverFonts = /* @__PURE__ */ new Map();
+  let firstMeasurerFont = null;
+  let firstResolverFont = null;
+  for (const buffer of fontBuffers) {
+    try {
+      const arrayBuffer = toArrayBuffer(buffer.data);
+      const isTtc = isTtcBuffer(arrayBuffer);
+      const fonts = parseFontBuffer(arrayBuffer, opentype);
+      for (const font of fonts) {
+        if (!firstMeasurerFont) firstMeasurerFont = font;
+        if (!firstResolverFont) firstResolverFont = font;
+        if (isTtc) {
+          const fontFamily = font.names.fontFamily;
+          if (fontFamily) {
+            for (const name of Object.values(fontFamily)) {
+              registerFont(name, font, reverseMap, measurerFonts, resolverFonts);
+            }
+          }
+        } else if (buffer.name) {
+          registerFont(buffer.name, font, reverseMap, measurerFonts, resolverFonts);
+        }
+      }
+    } catch {
+    }
+  }
+  if (measurerFonts.size === 0 && !firstMeasurerFont) return null;
+  const measurer = new OpentypeTextMeasurer(measurerFonts, firstMeasurerFont ?? void 0);
+  const fontResolver = new DefaultTextPathFontResolver(
+    resolverFonts,
+    firstResolverFont ?? void 0
+  );
+  return { measurer, fontResolver };
+}
 function registerFont(name, font, reverseMap, measurerFonts, resolverFonts) {
   const fullFont = font;
   if (!measurerFonts.has(name)) {
@@ -8077,13 +8328,15 @@ async function createOpentypeSetupFromSystem(additionalFontDirs, fontMapping) {
     try {
       const data = await (0, import_promises.readFile)(filePath);
       const arrayBuffer = toArrayBuffer(data);
-      const font = opentype.parse(arrayBuffer);
-      if (!firstMeasurerFont) firstMeasurerFont = font;
-      if (!firstResolverFont) firstResolverFont = font;
-      const fontFamily = font.names.fontFamily;
-      if (fontFamily) {
-        for (const name of Object.values(fontFamily)) {
-          registerFont(name, font, reverseMap, measurerFonts, resolverFonts);
+      const fonts = parseFontBuffer(arrayBuffer, opentype);
+      for (const font of fonts) {
+        if (!firstMeasurerFont) firstMeasurerFont = font;
+        if (!firstResolverFont) firstResolverFont = font;
+        const fontFamily = font.names.fontFamily;
+        if (fontFamily) {
+          for (const name of Object.values(fontFamily)) {
+            registerFont(name, font, reverseMap, measurerFonts, resolverFonts);
+          }
         }
       }
     } catch {
@@ -8229,6 +8482,8 @@ function collectFontsFromTextBody(textBody, fonts) {
   convertPptxToPng,
   convertPptxToSvg,
   createFontMapping,
+  createOpentypeSetupFromBuffers,
+  createOpentypeTextMeasurerFromBuffers,
   getMappedFont,
   getWarningEntries,
   getWarningSummary