@openpresentation/opf-pptx 0.0.1 → 0.2.0

package/dist/index.js

@@ -1,3 +1,8 @@
+import {importImageOrientation} from './image-import.js';
+import {nativeBackgroundFill, readNativeBackground} from './background.js';
+import { webpToPng } from '#image-fallback';
+import { rasterMetadata, pictureTransform, normalizeImageOrientation } from './image-geometry.js';
+import { composeSlide, fitText, textWidthMeasurer, resolveCanvasDimensions, resolveFontFamilies, resolveTextStyle } from "@openpresentation/opf/composition";
 import PptxGenJS from "pptxgenjs";
 import { unzipSync, zipSync } from "fflate";
 import { XMLParser } from "fast-xml-parser";
@@ -151,12 +156,20 @@ const CHART_COLORS = [
 ];
 
 export async function toPptx(input, options = {}) {
+  if (options.imageFormat !== undefined && !['compatible', 'preserve'].includes(options.imageFormat)) {
+    throw new OPFPptxError('invalid-image-format', 'imageFormat must be compatible or preserve.', {path: 'options.imageFormat'});
+  }
   const presentation = parseInput(input);
   assertValidBoundary(presentation);
 
-  const context = resolvePresentationContext(presentation, options);
+  const context = resolvePresentationContext(presentation, {...options,textMeasurement:undefined});
+  context.listMarkers = new Map();
+  context.tableHeaders = new Map();
+  context.imagePlacements = new Map();
+  context.backgroundFills = new Map();
+  context.imageFormat = options.imageFormat ?? "compatible";
   const pptx = new PptxGenJS();
-  configurePresentation(pptx, presentation, context);
+  configurePresentation(pptx, presentation, {...context,fonts:resolveSlideContext(presentation,presentation.slides[0],context,options).fonts});
 
   for (let index = 0; index < presentation.slides.length; index += 1) {
     await addSlide(pptx, presentation, presentation.slides[index], index, context, options);
@@ -204,7 +217,7 @@ export async function fromPptx(input, options = {}) {
   if (dimensions) imported.design = { dimensions };
 
   for (let index = 0; index < slidePaths.length; index += 1) {
-    imported.slides.push(importSlide(entries, slidePaths[index], index, dimensions));
+    imported.slides.push(importSlide(entries, slidePaths[index], index, dimensions, options));
   }
 
   const result = validatePresentation(imported);
@@ -344,7 +357,7 @@ function dimensionsFromPresentation(presentationRoot) {
   };
 }
 
-function importSlide(entries, slidePath, slideIndex, presentationDimensions) {
+function importSlide(entries, slidePath, slideIndex, presentationDimensions, options) {
   const doc = parseRequiredXml(entries, slidePath);
   const slideRoot = doc["p:sld"];
   if (!slideRoot) {
@@ -358,24 +371,17 @@ function importSlide(entries, slidePath, slideIndex, presentationDimensions) {
   const slide = {};
   if (slideRoot.show === "0") slide.hidden = true;
 
-  const background = slideBackground(slideRoot);
-  if (background) {
-    slide.design = {
-      background: {
-        type: "solid",
-        color: background
-      }
-    };
-  }
+  const background = readNativeBackground(slideRoot["p:cSld"]?.["p:bg"]?.["p:bgPr"], resolveCanvasDimensions(dimensions), diagnostic => options.onDiagnostic?.({...diagnostic, path: `slides.${slideIndex}.design.background`}));
+  if (background) slide.design = {background};
 
-  const items = collectSlideItems(entries, slideRoot, slidePath, relationships, dimensions)
+  const items = collectSlideItems(entries, slideRoot, slidePath, relationships, dimensions, options, slideIndex)
     .sort(comparePositionedItems);
   const titleItem = takeTitleItem(items, dimensions);
   if (titleItem) slide.title = firstLine(titleItem.text);
   const subtitleItem = takeSubtitleItem(items, titleItem, dimensions);
   if (subtitleItem) slide.subtitle = firstLine(subtitleItem.text);
 
-  const blocks = items
+  const blocks = mergeAdjacentBulletShapes(items)
     .map((item) => payloadFromSlideItem(item))
     .filter(Boolean);
   if (blocks.length > 0) slide.blocks = blocks;
@@ -383,14 +389,10 @@ function importSlide(entries, slidePath, slideIndex, presentationDimensions) {
   const notes = readSlideNotes(entries, relationships);
   if (notes) slide.notes = notes;
 
-  if (!slide.title && !slide.blocks && !slide.notes) {
-    slide.title = `Slide ${slideIndex + 1}`;
-  }
-
   return slide;
 }
 
-function collectSlideItems(entries, slideRoot, slidePath, relationships, dimensions) {
+function collectSlideItems(entries, slideRoot, slidePath, relationships, dimensions, options, slideIndex) {
   const tree = slideRoot["p:cSld"]?.["p:spTree"];
   const items = [];
 
@@ -404,8 +406,9 @@ function collectSlideItems(entries, slideRoot, slidePath, relationships, dimensi
     if (item) items.push(item);
   }
 
-  for (const picture of asArray(tree?.["p:pic"])) {
-    const item = importPicture(entries, picture, slidePath, relationships);
+  for (const [index, picture] of asArray(tree?.["p:pic"]).entries()) {
+    const report = diagnostic => options.onDiagnostic?.({...diagnostic, path: `slides.${slideIndex}.pictures.${index}`});
+    const item = importPicture(entries, picture, slidePath, relationships, report);
     if (item) items.push(item);
   }
 
@@ -478,13 +481,13 @@ function importGraphicFrame(entries, frame, slidePath, relationships) {
   };
 }
 
-function importPicture(entries, picture, slidePath, relationships) {
+function importPicture(entries, picture, slidePath, relationships, report) {
   const bounds = shapeBounds(picture["p:spPr"]?.["a:xfrm"]);
   const name = scalarText(picture["p:nvPicPr"]?.["p:cNvPr"]?.name).trim();
   const alt = scalarText(picture["p:nvPicPr"]?.["p:cNvPr"]?.descr).trim();
   const relId = picture["p:blipFill"]?.["a:blip"]?.["r:embed"];
   const relationship = relationships.get(relId);
-  const bytes = relationship?.path ? entries[relationship.path] : null;
+  let bytes = relationship?.path ? entries[relationship.path] : null;
   if (!bytes) {
     return {
       kind: "unknown",
@@ -494,6 +497,12 @@ function importPicture(entries, picture, slidePath, relationships) {
     };
   }
 
+  const crop = picture["p:blipFill"]?.["a:srcRect"];
+  if (crop && ['l','r','t','b'].some(key => Number(crop[key] ?? 0) !== 0)) {
+    report({code: 'unsupported-image-crop', message: 'Native picture crop is not represented by the imported OPF asset; the full image was retained.'});
+  }
+  bytes = importImageOrientation(bytes, picture["p:spPr"]?.["a:xfrm"], report);
+
   return {
     kind: "image",
     bounds,
@@ -501,7 +510,7 @@ function importPicture(entries, picture, slidePath, relationships) {
     payload: {
       type: "image",
       image: {
-        src: `data:${mediaTypeForPath(relationship.path)};base64,${bytesToBase64(bytes)}`,
+        src: `data:${rasterMetadata(bytes)?.mediaType ?? mediaTypeForPath(relationship.path)};base64,${bytesToBase64(bytes)}`,
         ...(alt ? { alt } : {})
       }
     }
@@ -525,7 +534,8 @@ function readParagraphs(txBody) {
       }
       return {
         text: texts.join("").trim(),
-        level: Number(paragraph?.["a:pPr"]?.lvl ?? 0),
+        bullet: asArray(paragraph?.["a:pPr"]).some(props => props?.["a:buChar"] !== undefined || props?.["a:buAutoNum"] !== undefined),
+        level: Number(asArray(paragraph?.["a:pPr"])[0]?.lvl ?? 0),
         maxFontSize: sizes.length > 0 ? Math.max(...sizes) : 0
       };
     })
@@ -552,7 +562,7 @@ function takeTitleItem(items, dimensions) {
 
   const titleLimit = dimensions.heightInches * 0.28;
   const candidateIndex = items.findIndex((item) => {
-    if (item.kind !== "text" || !item.text) return false;
+    if (item.kind !== "text" || !item.text || item.paragraphs.some(p=>p.bullet)) return false;
     const y = item.bounds?.y ?? 0;
     return y <= titleLimit && (item.maxFontSize >= 20 || /^title\b/i.test(item.name ?? ""));
   });
@@ -568,7 +578,7 @@ function takeSubtitleItem(items, titleItem, dimensions) {
   const titleBottom = (titleItem.bounds?.y ?? 0) + (titleItem.bounds?.h ?? 0);
   const subtitleLimit = Math.min(dimensions.heightInches * 0.34, 1.45);
   const candidateIndex = items.findIndex((item) => {
-    if (item.kind !== "text" || !item.text) return false;
+    if (item.kind !== "text" || !item.text || item.paragraphs.some(p=>p.bullet)) return false;
     const y = item.bounds?.y ?? 0;
     const h = item.bounds?.h ?? 0;
     return y >= titleBottom - 0.05
@@ -581,10 +591,29 @@ function takeSubtitleItem(items, titleItem, dimensions) {
   return null;
 }
 
+// Adjacent native bullet boxes on the same text column form one imported list.
+// This is a geometry heuristic, not a lossless reconstruction of arbitrary PPTX.
+function mergeAdjacentBulletShapes(items) {
+  const result=[];
+  for(const item of items){
+    const previous=result.at(-1);
+    const bullets=value=>value?.kind==='text'&&value.paragraphs.length&&value.paragraphs.every(p=>p.bullet);
+    if(bullets(previous)&&bullets(item)&&previous.bounds&&item.bounds
+      &&Math.abs(previous.bounds.x-item.bounds.x)<.05
+      &&item.bounds.y>=previous.bounds.y+previous.bounds.h-.02
+      &&item.bounds.y-(previous.bounds.y+previous.bounds.h)<.3){
+      previous.paragraphs.push(...item.paragraphs);
+      previous.text+='\n'+item.text;
+      previous.bounds.h=item.bounds.y+item.bounds.h-previous.bounds.y;
+    }else result.push({...item,paragraphs:item.paragraphs?[...item.paragraphs]:undefined,bounds:item.bounds?{...item.bounds}:undefined});
+  }
+  return result;
+}
+
 function payloadFromSlideItem(item) {
   if (item.payload) return item.payload;
   if (item.kind === "text") {
-    if (item.paragraphs.length > 1) {
+    if (item.paragraphs.length > 1 || item.paragraphs.some(p=>p.bullet)) {
       return {
         type: "list",
         items: item.paragraphs.map((paragraph) => (
@@ -602,13 +631,14 @@ function payloadFromSlideItem(item) {
 
 function tableFromXml(table) {
   const rows = asArray(table["a:tr"])
-    .map((row) => asArray(row?.["a:tc"]).map((cell) => textFromTextBody(cell?.["a:txBody"])))
-    .filter((row) => row.some(Boolean));
-  if (rows.length === 0) return { rows: [] };
-  return {
-    columns: rows[0],
-    rows: rows.slice(1)
-  };
+    .map((row) => asArray(row?.["a:tc"]).map((cell) => textFromTextBody(cell?.["a:txBody"])));
+  // DrawingML's firstRow flag applies header-row formatting. Without that
+  // signal, retain all rows as data instead of guessing from their contents.
+  const firstRow = table["a:tblPr"]?.firstRow;
+  const hasHeaders = firstRow === "1" || firstRow === "true";
+  return hasHeaders && rows.length
+    ? { columns: rows[0], rows: rows.slice(1) }
+    : { rows };
 }
 
 function chartFromRelationship(entries, slidePath, relationships, relId) {
@@ -693,10 +723,6 @@ function readSlideNotes(entries, relationships) {
   return bodyNotes.join("\n").trim();
 }
 
-function slideBackground(slideRoot) {
-  const color = slideRoot["p:cSld"]?.["p:bg"]?.["p:bgPr"]?.["a:solidFill"]?.["a:srgbClr"]?.val;
-  return color ? `#${normalizeHex(color)}` : "";
-}
 
 function textFromTextBody(txBody) {
   return readParagraphs(txBody).map((paragraph) => paragraph.text).filter(Boolean).join("\n").trim();
@@ -733,7 +759,9 @@ function isFullSlide(bounds, dimensions) {
 function emuToInches(value) {
   const number = Number(value);
   if (!Number.isFinite(number)) return null;
-  return Math.round((number / EMUS_PER_INCH) * 1_000_000) / 1_000_000;
+  // Keep native precision through layout/rendering. Rounding inches to six
+  // decimals turns a 1280-pixel canvas into 1279.999968 and changes raster edges.
+  return number / EMUS_PER_INCH;
 }
 
 function asArray(value) {
@@ -783,7 +811,7 @@ function assertValidBoundary(presentation) {
 
 function resolvePresentationContext(presentation, options) {
   const design = presentation.design ?? {};
-  const theme = resolveCatalogRecord(presentation, "themes", design.theme, DEFAULTS.theme);
+  const theme = resolveDesignRecord(presentation, "themes", design.theme, DEFAULTS.theme);
   const colorScheme = resolveDesignRecord(
     presentation,
     "colorSchemes",
@@ -799,7 +827,9 @@ function resolvePresentationContext(presentation, options) {
   const dimensions = resolveDimensions(design.dimensions ?? theme?.dimensions);
   const background = resolveBackground(design.background ?? theme?.background, colorScheme);
   const fonts = resolveFonts(fontScheme);
+  for (const role of ["heading","body","code"]) fonts[role] = resolveTextStyle({fontFamily:fonts[role],fontWeight:role === "heading" ? 700 : 400},options.textMeasurement).fontFamily;
   const textColor = readableTextColor(background, colorScheme);
+  const darkBackground = isDarkHex(background);
 
   return {
     seed: Number.isInteger(options.seed) ? options.seed : DEFAULT_SEED,
@@ -809,14 +839,15 @@ function resolvePresentationContext(presentation, options) {
     layoutName: "OPF_CANVAS",
     dimensions,
     colorScheme,
+    backgroundDefinition: design.background ?? theme?.background,
     fonts,
     colors: {
       background,
       text: textColor,
-      mutedText: normalizeHex(colorScheme.textSecondary ?? colorScheme.dark2 ?? "#475569"),
+      mutedText: normalizeHex(colorScheme.textSecondary ?? (darkBackground ? colorScheme.light2 : colorScheme.dark2) ?? "#475569"),
       accent: normalizeHex(colorScheme.primary ?? colorScheme.accent1 ?? "#2874A6"),
-      surface: normalizeHex(colorScheme.surface ?? colorScheme.light2 ?? "#F8FAFC"),
-      border: normalizeHex(colorScheme.accent3 ?? "#CBD5E1")
+      surface: normalizeHex(colorScheme.surface ?? (darkBackground ? colorScheme.dark2 : colorScheme.light2) ?? "#F8FAFC"),
+      border: normalizeHex(colorScheme.accent5 ?? "#CBD5E1")
     }
   };
 }
@@ -841,151 +872,61 @@ function configurePresentation(pptx, presentation, context) {
 
 async function addSlide(pptx, presentation, opfSlide, slideIndex, context, options) {
   const slide = pptx.addSlide();
-  const slideContext = resolveSlideContext(presentation, opfSlide, context);
+  const slideContext = resolveSlideContext(presentation, opfSlide, context, options);
   slide.background = { color: slideContext.colors.background };
+  const backgroundFill = nativeBackgroundFill(slideContext.backgroundDefinition, {
+    width: slideContext.dimensions.widthInches, height: slideContext.dimensions.heightInches
+  }, slideContext.colors.background);
+  if (backgroundFill) context.backgroundFills.set(`ppt/slides/slide${slideIndex + 1}.xml`, backgroundFill);
   slide.color = slideContext.colors.text;
   if (opfSlide.hidden === true) slide.hidden = true;
 
   const { widthInches, heightInches } = slideContext.dimensions;
-  const margin = 0.55;
-  let y = 0.34;
-
-  if (opfSlide.tag) {
-    slide.addText(String(opfSlide.tag), {
-      x: margin,
-      y,
-      w: widthInches - margin * 2,
-      h: 0.24,
-      margin: 0,
-      fontFace: slideContext.fonts.body,
-      fontSize: 9,
-      bold: true,
-      color: slideContext.colors.accent,
-      fit: "shrink"
-    });
-    y += 0.32;
-  }
-
-  const title = opfSlide.title ?? presentation.title ?? presentation.name;
-  if (title) {
-    slide.addText(String(title), {
-      x: margin,
-      y,
-      w: widthInches - margin * 2,
-      h: 0.58,
-      margin: 0,
-      fontFace: slideContext.fonts.heading,
-      fontSize: 28,
-      bold: true,
-      color: slideContext.colors.text,
-      fit: "shrink",
-      breakLine: false
-    });
-    y += 0.68;
-  }
-
-  const subtitle = opfSlide.subtitle ?? presentation.subtitle;
-  if (subtitle) {
-    slide.addText(String(subtitle), {
-      x: margin,
-      y,
-      w: widthInches - margin * 2,
-      h: 0.34,
-      margin: 0,
-      fontFace: slideContext.fonts.body,
-      fontSize: 14,
-      color: slideContext.colors.mutedText,
-      fit: "shrink"
-    });
-    y += 0.48;
-  }
-
-  const contentTop = Math.max(y + 0.08, title || subtitle || opfSlide.tag ? 1.25 : 0.55);
-  const contentArea = {
-    x: margin,
-    y: contentTop,
-    w: widthInches - margin * 2,
-    h: Math.max(0.7, heightInches - contentTop - 0.48)
-  };
-  const bindings = collectSlideBindings(opfSlide, slideIndex);
-
-  for (let index = 0; index < bindings.length; index += 1) {
-    const binding = bindings[index];
-    const region = binding.regionKey
-      ? regionFromPromotedKey(binding.regionKey, contentArea)
-      : regionFromIndex(index, bindings.length, contentArea);
-    await addPayload(slide, presentation, binding.payload, insetRegion(region, 0.08), binding.path, slideContext, options);
+  const layout = resolveCatalogRecord(presentation, "layouts", opfSlide.layout, "blank") ?? {};
+  if (opfSlide.layout && layout.id !== opfSlide.layout) throw new OPFPptxError("catalog-resolution-failed", `Layout '${opfSlide.layout}' needs an inline or bundled catalog record.`, { path: `slides.${slideIndex}.layout` });
+  const geometry = composeSlide(opfSlide, { width: widthInches * 96, height: heightInches * 96, layout, slideIndex, fonts: slideContext.fonts, textMeasurement: options.textMeasurement });
+  for (const diagnostic of geometry.diagnostics) options.onDiagnostic?.(diagnostic);
+  for (const item of geometry.items) {
+    const region = { x: item.box.x / 96, y: item.box.y / 96, w: item.box.width / 96, h: item.box.height / 96 };
+    if (["title", "subtitle", "tag"].includes(item.field)) {
+      slide.addText(item.text.lines.join("\n"), {
+        ...textBoxOptions(region, slideContext, item.text.fontSize * 0.75),
+        fontFace: item.textStyle.fontFamily,
+        bold: item.textStyle.fontWeight >= 600,
+        italic: item.textStyle.italic,
+        color: item.field === "tag" ? slideContext.colors.accent : slideContext.colors.text,
+        breakLine: false
+      });
+    } else if ((item.field === "items" || item.field === "bullets") && item.text?.listEntries) {
+      addMeasuredList(slide,item.text,slideContext);
+    } else if (item.field === "text" && item.text?.richLines) {
+      const alignment=opfSlide.design?.contentAlignment??presentation.design?.contentAlignment??'left';
+      for(const line of item.text.richLines){
+        const runs=line.fragments.map(fragment=>({text:fragment.text,options:{fontFace:fragment.style.fontFamily,fontSize:fragment.fontSize*.75,bold:fragment.style.fontWeight>=600,italic:fragment.style.italic,color:normalizeHex(fragment.run.color??slideContext.colors.text),underline:fragment.run.underline?{color:normalizeHex(fragment.run.color??slideContext.colors.text)}:undefined,strike:fragment.run.strikethrough?'sngStrike':undefined,baseline:fragment.baselineShift?-fragment.baselineShift/fragment.fontSize*2000:undefined,hyperlink:fragment.run.link&&/^(https?:|mailto:)/i.test(fragment.run.link)?{url:fragment.run.link}:undefined}}));
+        if(runs.length)slide.addText(runs,{...textBoxOptions({...region,y:region.y+line.y/96,h:line.height/96},slideContext,item.text.fontSize*.75),align:alignment,fit:'none',wrap:false,lineSpacingMultiple:1});
+      }
+    } else if (item.field === "text" && typeof item.value === "string") {
+      slide.addText(item.text.lines.join("\n"), {...textBoxOptions(region, slideContext, item.text.fontSize * 0.75),fontFace:item.textStyle.fontFamily,bold:item.textStyle.fontWeight>=600,italic:item.textStyle.italic});
+    } else {
+      await addPayload(slide, presentation, item.payload, region, item.path, { ...slideContext, composition: item.composition, contentAlignment: opfSlide.design?.contentAlignment ?? presentation.design?.contentAlignment ?? "left" }, options);
+    }
   }
 
   if (opfSlide.notes) slide.addNotes(String(opfSlide.notes));
 }
 
-function resolveSlideContext(presentation, slide, baseContext) {
-  if (!slide.design) return baseContext;
-  const design = slide.design;
-  const colorScheme = resolveDesignRecord(
-    presentation,
-    "colorSchemes",
-    design.colorScheme,
-    baseContext.colorScheme.id ?? DEFAULTS.colorScheme
-  );
-  const fontScheme = resolveDesignRecord(
-    presentation,
-    "fontSchemes",
-    design.fontScheme,
-    baseContext.fonts.id ?? DEFAULTS.fontScheme
-  );
-  const background = design.background
-    ? resolveBackground(design.background, colorScheme)
-    : baseContext.colors.background;
-  const fonts = design.fontScheme ? resolveFonts(fontScheme) : baseContext.fonts;
-
-  return {
-    ...baseContext,
-    colorScheme,
-    fonts,
-    colors: {
-      ...baseContext.colors,
-      background,
-      text: readableTextColor(background, colorScheme),
-      mutedText: normalizeHex(colorScheme.textSecondary ?? colorScheme.dark2 ?? baseContext.colors.mutedText),
-      accent: normalizeHex(colorScheme.primary ?? colorScheme.accent1 ?? baseContext.colors.accent),
-      surface: normalizeHex(colorScheme.surface ?? colorScheme.light2 ?? baseContext.colors.surface),
-      border: normalizeHex(colorScheme.accent3 ?? baseContext.colors.border)
-    }
-  };
-}
-
-function collectSlideBindings(slide, slideIndex) {
-  const promoted = PROMOTED_REGION_KEYS
-    .filter((key) => slide[key] !== undefined)
-    .map((key) => ({
-      payload: slide[key],
-      regionKey: key,
-      path: `slides.${slideIndex}.${key}`
-    }));
-
-  if (promoted.length > 0) return promoted;
-
-  if (Array.isArray(slide.blocks) && slide.blocks.length > 0) {
-    return slide.blocks.map((payload, index) => ({
-      payload,
-      path: `slides.${slideIndex}.blocks.${index}`
-    }));
+function resolveSlideContext(presentation, slide, baseContext, options) {
+  const effective = { ...presentation, design: { ...presentation.design, ...slide.design } };
+  const resolved = resolvePresentationContext(effective, options);
+  if (Math.abs(resolved.dimensions.widthInches - baseContext.dimensions.widthInches) > 1e-6
+    || Math.abs(resolved.dimensions.heightInches - baseContext.dimensions.heightInches) > 1e-6) {
+    throw new OPFPptxError("mixed-slide-dimensions", "PowerPoint requires one canvas size per presentation. Set dimensions on the deck or export this slide separately.");
   }
-
-  return ROOT_PAYLOAD_FIELDS
-    .filter((field) => slide[field] !== undefined)
-    .map((field) => ({
-      payload: { type: fieldToType(field), [field]: slide[field] },
-      path: `slides.${slideIndex}.${field}`
-    }));
+  return { ...baseContext, backgroundDefinition: resolved.backgroundDefinition, colorScheme: resolved.colorScheme, fonts: resolved.fonts, colors: resolved.colors, imageFill: effective.design.imageFill ?? "fit" };
 }
 
 function fieldToType(field) {
-  if (field === "items") return "list";
-  if (field === "bullets") return "text";
-  return field;
+  return field === "items" || field === "bullets" ? "list" : field;
 }
 
 async function addPayload(slide, presentation, payload, region, path, context, options) {
@@ -1007,7 +948,7 @@ async function addPayload(slide, presentation, payload, region, path, context, o
       addChartPayload(slide, payload.chart, region, context);
       break;
     case "table":
-      addTablePayload(slide, payload.table, region, context);
+      addTablePayload(slide, payload.table, region, context, options, path);
       break;
     case "code":
       addCodePayload(slide, payload.code, region, context);
@@ -1048,6 +989,31 @@ function addTextPayload(slide, value, region, context) {
   slide.addText(stringifyText(value), textBoxOptions(region, context, 18));
 }
 
+function richLineRuns(line,color) {
+  return line.fragments.map(fragment=>({text:fragment.text,options:{fontFace:fragment.style.fontFamily,fontSize:fragment.fontSize*.75,bold:fragment.style.fontWeight>=600,italic:fragment.style.italic,color:normalizeHex(fragment.run.color??color),underline:fragment.run.underline?{color:normalizeHex(fragment.run.color??color)}:undefined,strike:fragment.run.strikethrough?'sngStrike':undefined,baseline:fragment.baselineShift?-fragment.baselineShift/fragment.fontSize*2000:undefined,hyperlink:fragment.run.link&&/^(https?:|mailto:)/i.test(fragment.run.link)?{url:fragment.run.link}:undefined}}));
+}
+function addMeasuredList(slide,fit,context) {
+  for(const entry of fit.listEntries){
+    const addLines=(text,box,color,withBullet)=>{
+      text.richLines.forEach((line,index)=>{
+        const first=withBullet&&index===0,level=Math.min(8,entry.level),inset=first?entry.marker.indent*(level+1):0;
+        const region={x:(box.x-inset)/96,y:(box.y+line.y)/96,w:(box.width+inset)/96,h:line.height/96};
+        const objectName=first?`OPF list paragraph ${context.listMarkers.size+1}`:undefined;
+        if(first)context.listMarkers.set(objectName,{fontFamily:entry.marker.style.fontFamily,fontSize:entry.marker.fontSize*.75,color:normalizeHex(context.colors.text)});
+        const paragraph=first?{bullet:{characterCode:entry.marker.text.codePointAt(0).toString(16).padStart(4,'0'),indent:entry.marker.indent*.75},indentLevel:level}:{bullet:false};
+        const runs=richLineRuns(line,color);
+        if(!runs.length)runs.push({text:'',options:{}});
+        // Keep paragraph intent identical across runs. ZIP normalization below
+        // removes the duplicate paragraph-property nodes emitted by PptxGenJS.
+        for(const run of runs)Object.assign(run.options,paragraph);
+        slide.addText(runs,{...textBoxOptions(region,context,text.fontSize*.75),fontFace:entry.marker.style.fontFamily,objectName,align:'left',fit:'none',wrap:false,lineSpacingMultiple:1,...paragraph});
+      });
+    };
+    addLines(entry.text,entry.textBox,context.colors.text,true);
+    if(entry.description)addLines(entry.description,entry.descriptionBox,context.colors.mutedText,false);
+  }
+}
+
 function addListPayload(slide, items, region, context) {
   const list = Array.isArray(items) ? items : [];
   if (list.length === 0) {
@@ -1093,8 +1059,11 @@ async function addImagePayload(slide, presentation, asset, region, path, context
     addPlaceholderPayload(slide, "Image", asset, region, context);
     return;
   }
+  const objectName = `OPF image ${context.imagePlacements.size + 1}`;
+  context.imagePlacements.set(objectName, { region, mode: context.imageFill, path });
   slide.addImage({
     ...resolved,
+    objectName,
     x: region.x,
     y: region.y,
     w: region.w,
@@ -1129,44 +1098,62 @@ function addChartPayload(slide, chart, region, context) {
   });
 }
 
-function addTablePayload(slide, table, region, context) {
-  const rows = [];
-  if (Array.isArray(table?.columns) && table.columns.length > 0) {
-    rows.push(table.columns.map((value) => ({
-      text: stringifyText(value),
-      options: {
-        bold: true,
-        color: context.colors.text,
-        fill: { color: context.colors.surface }
-      }
-    })));
-  }
-  if (Array.isArray(table?.rows)) {
-    for (const row of table.rows) {
-      rows.push((Array.isArray(row) ? row : [row]).map((value) => ({
-        text: stringifyText(value),
-        options: { color: context.colors.text }
-      })));
-    }
-  }
-
-  if (rows.length === 0) {
+function addTablePayload(slide, table, region, context, options, path) {
+  const scale = Math.min(context.dimensions.widthInches * 96, context.dimensions.heightInches * 96) / 720;
+  const hasHeaders = Array.isArray(table?.columns) && table.columns.length > 0;
+  const sourceRows = [...(hasHeaders ? [table.columns] : []), ...(table?.rows ?? [])];
+  if (sourceRows.length === 0) {
     addPlaceholderPayload(slide, "Table", table, region, context);
     return;
   }
 
+  const columnCount = Math.max(1, ...sourceRows.map(row => row.length));
+  const rowHeight = Math.min(54 * scale / 96, region.h / sourceRows.length);
+  const cellBox = {
+    x: 0, y: 0,
+    width: Math.max(scale, region.w * 96 / columnCount - 20 * scale),
+    height: Math.max(scale, rowHeight * 96 - 12 * scale),
+  };
+  const rows = sourceRows.map((row, rowIndex) => Array.from({ length: columnCount }, (_, columnIndex) => {
+    const header = hasHeaders && rowIndex === 0;
+    const cellPath = header ? `${path}.columns.${columnIndex}` : `${path}.rows.${rowIndex - Number(hasHeaders)}.${columnIndex}`;
+    const text = stringifyText(row[columnIndex]);
+    const style = resolveTextStyle({ fontFamily: context.fonts.body, fontWeight: header ? 700 : 400, italic: false, path: cellPath }, options.textMeasurement);
+    const fit = fitText(text, cellBox, 15 * scale, (context.composition?.minFontSize ?? 16) * scale, textWidthMeasurer(style, options.textMeasurement));
+    return {
+      // Keep native wrapping and the original cell value: inserting measured
+      // soft wraps into the text would change a later import or copy operation.
+      text,
+      options: {
+        fontFace: style.fontFamily,
+        fontSize: fit.fontSize * 0.75,
+        bold: style.fontWeight >= 600,
+        italic: style.italic,
+        lineSpacing: fit.lineHeight * 0.75,
+        paraSpaceAfter: 0,
+        align: context.contentAlignment,
+        color: header ? "FFFFFF" : context.colors.text,
+        fill: { color: header ? context.colors.accent : context.colors.surface },
+      },
+    };
+  }));
+  const objectName = `OPF table ${context.tableHeaders.size + 1}`;
+  context.tableHeaders.set(objectName, hasHeaders);
   slide.addTable(rows, {
+    objectName,
     x: region.x,
     y: region.y,
     w: region.w,
-    h: region.h,
+    h: rowHeight * rows.length,
+    rowH: rowHeight,
+    colW: Array(columnCount).fill(region.w / columnCount),
+    autoPage: false,
     fontFace: context.fonts.body,
-    fontSize: 10,
+    fontSize: 15 * scale * 0.75,
     color: context.colors.text,
     border: { type: "solid", color: context.colors.border, pt: 0.75 },
-    margin: 0.05,
-    valign: "mid",
-    fit: "shrink"
+    margin: [6 * scale, 7.5 * scale, 3 * scale, 7.5 * scale],
+    valign: "top"
   });
 }
 
@@ -1263,13 +1250,15 @@ function textBoxOptions(region, context, fontSize) {
     y: region.y,
     w: region.w,
     h: region.h,
-    margin: 4,
+    margin: 0,
+    paraSpaceAfter: 0,
+    lineSpacingMultiple: 1.22,
     fontFace: context.fonts.body,
     fontSize,
     color: context.colors.text,
     breakLine: false,
     fit: "shrink",
-    valign: "mid"
+    valign: "top"
   };
 }
 
@@ -1296,7 +1285,9 @@ function textRuns(value, context, fallbackFontSize) {
         color: normalizeHex(run?.color ?? context.colors.text),
         fontFace: run?.fontFamily ?? context.fonts.body,
         fontSize: run?.fontSize ?? fallbackFontSize,
-        hyperlink: run?.link ? { url: run.link } : undefined
+        superscript: run?.superscript,
+        subscript: !run?.superscript && run?.subscript,
+        hyperlink: run?.link && /^(https?:|mailto:)/i.test(run.link) ? { url: run.link } : undefined
       }
     };
   });
@@ -1462,15 +1453,8 @@ function withoutSchema(value) {
 }
 
 function resolveDimensions(value) {
-  if (typeof value === "string") return DIMENSION_PRESETS[value] ?? DIMENSION_PRESETS.widescreen;
-  if (isPlainObject(value)) {
-    const preset = DIMENSION_PRESETS[value.preset] ?? DIMENSION_PRESETS.widescreen;
-    return {
-      widthInches: value.widthInches ?? preset.widthInches,
-      heightInches: value.heightInches ?? preset.heightInches
-    };
-  }
-  return DIMENSION_PRESETS.widescreen;
+  const { width, height } = resolveCanvasDimensions(value);
+  return { widthInches: width / 96, heightInches: height / 96 };
 }
 
 function resolveBackground(value, colorScheme) {
@@ -1489,21 +1473,9 @@ function resolveBackground(value, colorScheme) {
 }
 
 function resolveFonts(fontScheme) {
-  const heading = fontFamily(fontScheme.heading) ?? fontScheme.major ?? "Aptos Display";
-  const body = fontFamily(fontScheme.body) ?? fontScheme.minor ?? "Aptos";
-  return {
-    id: fontScheme.id,
-    heading,
-    body,
-    code: fontFamily(fontScheme.code) ?? "Consolas"
-  };
+  return {id:fontScheme.id,...resolveFontFamilies(fontScheme)};
 }
 
-function fontFamily(value) {
-  if (typeof value === "string") return value;
-  if (isPlainObject(value) && typeof value.family === "string") return value.family;
-  return null;
-}
 
 function readableTextColor(background, colorScheme) {
   return isDarkHex(background)
@@ -1532,61 +1504,7 @@ function isDarkHex(value) {
   return (red * 299 + green * 587 + blue * 114) / 1000 < 128;
 }
 
-function regionFromPromotedKey(key, area) {
-  const [first, second] = key.includes(":") ? key.split(":") : [key, null];
-  const rowPart = second ? first : isRowPart(first) ? first : "top+middle+bottom";
-  const colPart = second ? second : isColumnPart(first) ? first : "left+center+right";
-  const rowSpan = span(rowPart, ["top", "middle", "bottom"]);
-  const colSpan = span(colPart, ["left", "center", "right"]);
-  const cellW = area.w / 3;
-  const cellH = area.h / 3;
-
-  return {
-    x: area.x + colSpan.start * cellW,
-    y: area.y + rowSpan.start * cellH,
-    w: (colSpan.end - colSpan.start + 1) * cellW,
-    h: (rowSpan.end - rowSpan.start + 1) * cellH
-  };
-}
-
-function isRowPart(value) {
-  return value.split("+").every((part) => ["top", "middle", "bottom"].includes(part));
-}
-
-function isColumnPart(value) {
-  return value.split("+").every((part) => ["left", "center", "right"].includes(part));
-}
-
-function span(value, order) {
-  const indexes = value.split("+").map((part) => order.indexOf(part)).filter((index) => index >= 0);
-  if (indexes.length === 0) return { start: 0, end: order.length - 1 };
-  return { start: Math.min(...indexes), end: Math.max(...indexes) };
-}
-
-function regionFromIndex(index, total, area) {
-  if (total <= 1) return area;
-  const columns = total === 2 ? 2 : Math.ceil(Math.sqrt(total));
-  const rows = Math.ceil(total / columns);
-  const row = Math.floor(index / columns);
-  const col = index % columns;
-  return {
-    x: area.x + (area.w / columns) * col,
-    y: area.y + (area.h / rows) * row,
-    w: area.w / columns,
-    h: area.h / rows
-  };
-}
-
-function insetRegion(region, amount) {
-  return {
-    x: region.x + amount,
-    y: region.y + amount,
-    w: Math.max(0.2, region.w - amount * 2),
-    h: Math.max(0.2, region.h - amount * 2)
-  };
-}
-
-function normalizePptxZip(raw, context) {
+async function normalizePptxZip(raw, context) {
   let entries;
   try {
     entries = unzipSync(raw);
@@ -1596,18 +1514,59 @@ function normalizePptxZip(raw, context) {
     });
   }
 
+  const imageSources = new Map();
+  for (const [part, bytes] of Object.entries(entries)) {
+    if (!/^ppt\/slides\/slide\d+\.xml$/.test(part)) continue;
+    const relationships = parseRelationships(entries, part);
+    for (const [picture] of decodeText(bytes).matchAll(/<p:pic>[\s\S]*?<\/p:pic>/g)) {
+      const placement = context.imagePlacements.get(picture.match(/name="(OPF image \d+)"/)?.[1]);
+      const id = picture.match(/<a:blip\b[^>]*r:embed="([^"]+)"/)?.[1];
+      if (placement) imageSources.set(relationships.get(id)?.path, placement.path);
+    }
+  }
+  const imageMetadata = new Map();
+  for (const [part, bytes] of Object.entries(entries)) {
+    if (!part.startsWith('ppt/media/')) continue;
+    let metadata = rasterMetadata(bytes);
+    if (metadata?.mediaType === 'image/webp' && context.imageFormat === 'compatible') {
+      try {
+        if (metadata.width * metadata.height > 40_000_000) throw new Error('Image dimensions exceed the 40 megapixel conversion limit.');
+        const png = await webpToPng(bytes);
+        metadata = rasterMetadata(png);
+        if (metadata?.mediaType !== 'image/png') throw new Error('The local decoder did not return a PNG.');
+        entries[part] = png;
+      } catch (error) {
+        throw new OPFPptxError('image-conversion-failed', 'WebP could not be converted to a compatible PNG.', {path: imageSources.get(part) ?? part, cause: errorMessage(error)});
+      }
+    }
+    imageMetadata.set(part, metadata);
+  }
   const output = {};
   const renameMaps = buildRenameMaps(Object.keys(entries));
+  // The host may transform assets or supply a filename/MIME hint that no
+  // longer matches its bytes. Native package metadata must describe the bytes.
+  renameMaps.media = new Map();
+  for (const [path, metadata] of imageMetadata) {
+    if (!metadata) continue;
+    const extension = metadata.mediaType.slice('image/'.length);
+    const currentExtension = path.split('.').at(-1).toLowerCase();
+    if (currentExtension === extension || (extension === 'jpeg' && currentExtension === 'jpg')) continue;
+    const target = path.replace(/\.[^/.]+$/, `.${extension}`);
+    if (target !== path && Object.hasOwn(entries, target)) throw new OPFPptxError('packaging-failed', 'Normalized image paths collide.', {path, target});
+    renameMaps.media.set(path, target);
+  }
   for (const path of Object.keys(entries).sort()) {
     const normalizedPath = normalizePartPath(path, renameMaps);
-    const bytes = normalizePartBytes(path, entries[path], context, renameMaps);
+    const bytes = normalizePartBytes(path, entries[path], context, renameMaps, entries, imageMetadata);
     output[normalizedPath] = [bytes, {
       level: context.compressionLevel,
       mtime: context.zipDate
     }];
   }
 
-  return zipSync(output, {
+  // Sort after chart/worksheet renaming; source counters can cross digit widths.
+  const sortedOutput = Object.fromEntries(Object.keys(output).sort().map(path => [path, output[path]]));
+  return zipSync(sortedOutput, {
     level: context.compressionLevel,
     mtime: context.zipDate
   });
@@ -1619,7 +1578,8 @@ function normalizeCoreProperties(xml, timestamp) {
     .replace(/<dcterms:modified xsi:type="dcterms:W3CDTF">[^<]*<\/dcterms:modified>/g, `<dcterms:modified xsi:type="dcterms:W3CDTF">${timestamp}</dcterms:modified>`);
 }
 
-function normalizePartBytes(path, bytes, context, renameMaps) {
+function normalizePartBytes(path, bytes, context, renameMaps, entries, imageMetadata) {
+  if (imageMetadata.has(path)) return normalizeImageOrientation(bytes, imageMetadata.get(path));
   if (path.endsWith(".xlsx")) {
     return normalizeNestedZip(bytes, context);
   }
@@ -1627,7 +1587,71 @@ function normalizePartBytes(path, bytes, context, renameMaps) {
     return encodeText(normalizePartReferences(normalizeCoreProperties(decodeText(bytes), context.timestamp), renameMaps));
   }
   if (isXmlPart(path)) {
-    return encodeText(normalizePartReferences(decodeText(bytes), renameMaps));
+    let xml=decodeText(bytes);
+    if (path === '[Content_Types].xml') {
+      // Explicit per-part types also correct PptxGenJS's image/jpg default.
+      const overrides = [...imageMetadata].filter(([, metadata]) => metadata).map(([part, metadata]) =>
+        `<Override PartName="/${part}" ContentType="${metadata.mediaType}"/>`).join('');
+      xml = xml.replace('</Types>', `${overrides}</Types>`);
+    }
+    if (/^ppt\/slides\/slide\d+\.xml$/.test(path)) {
+      const fill = context.backgroundFills.get(path);
+      if (fill) xml = xml.replace(/<p:bg>[\s\S]*?<\/p:bg>/, `<p:bg><p:bgPr>${fill}<a:effectLst/></p:bgPr></p:bg>`);
+      // PptxGenJS table IDs can collide with other objects on the same slide.
+      // Preserve existing IDs and allocate unused IDs only for duplicates. This
+      // export path creates no connector attachments or animation ID references.
+      const objectIds = [...xml.matchAll(/<p:cNvPr\b[^>]*\bid="(\d+)"/g)].map(match => Number(match[1]));
+      let nextObjectId = Math.max(0, ...objectIds) + 1;
+      const seenObjectIds = new Set();
+      xml = xml.replace(/(<p:cNvPr\b[^>]*\bid=")(\d+)(")/g, (node, before, rawId, after) => {
+        const id = Number(rawId);
+        if (seenObjectIds.has(id)) return `${before}${nextObjectId++}${after}`;
+        seenObjectIds.add(id);
+        return node;
+      });
+      // PptxGenJS 4 has no firstRow option. Set the native flag explicitly so
+      // viewers and later imports distinguish column labels from data rows.
+      xml = xml.replace(/<p:graphicFrame>([\s\S]*?)<\/p:graphicFrame>/g, frame => {
+        const name = frame.match(/name="(OPF table \d+)"/)?.[1];
+        if (!context.tableHeaders.has(name)) return frame;
+        return frame.replace('<a:tblPr/>', `<a:tblPr firstRow="${context.tableHeaders.get(name) ? 1 : 0}"/>`);
+      });
+      // Image data is already resolved and embedded by PptxGenJS. Read those
+      // exact bytes instead of fetching or resolving the source a second time.
+      const relationships = parseRelationships(entries, path);
+      xml = xml.replace(/<p:pic>([\s\S]*?)<\/p:pic>/g, picture => {
+        const placement = context.imagePlacements.get(picture.match(/name="(OPF image \d+)"/)?.[1]);
+        if (!placement) return picture;
+        const id = picture.match(/<a:blip\b[^>]*r:embed="([^"]+)"/)?.[1];
+        const dimensions = imageMetadata.get(relationships.get(id)?.path);
+        if (!dimensions) throw new OPFPptxError("unsupported-image-dimensions", "Image fitting requires readable PNG, JPEG, GIF or WebP dimensions. Supply a supported raster image through imageResolver.", { path: placement.path });
+        const fitted = pictureTransform(dimensions, placement.region, placement.mode);
+        const emu = value => Math.round(value * EMUS_PER_INCH);
+        const transformAttrs = `${fitted.rotation ? ` rot="${fitted.rotation * 60000}"` : ''}${fitted.flipH ? ' flipH="1"' : ''}${fitted.flipV ? ' flipV="1"' : ''}`;
+        picture = picture.replace(/<a:xfrm\b[^>]*>[\s\S]*?<\/a:xfrm>/, `<a:xfrm${transformAttrs}><a:off x="${emu(fitted.x)}" y="${emu(fitted.y)}"/><a:ext cx="${emu(fitted.w)}" cy="${emu(fitted.h)}"/></a:xfrm>`);
+        if (fitted.crop) {
+          const attrs = Object.entries(fitted.crop).map(([key, value]) => `${key}="${value}"`).join(' ');
+          picture = picture.replace('<a:stretch>', `<a:srcRect ${attrs}/><a:stretch>`);
+        }
+        return picture;
+      });
+      // Native bullets otherwise inherit the first rich run's size, font and
+      // color, which can differ from the measured list marker.
+      xml=xml.replace(/<p:sp>([\s\S]*?)<\/p:sp>/g,(shape)=>{
+        const marker=context.listMarkers.get(shape.match(/name="(OPF list paragraph \d+)"/)?.[1]);
+        if(!marker)return shape;
+        const family=marker.fontFamily.replace(/[&<>"']/g,char=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&apos;'}[char]));
+        return shape.replace(/<a:buSzPct val="100000"\/>/g,`<a:buClr><a:srgbClr val="${marker.color}"/></a:buClr><a:buSzPts val="${Math.round(marker.fontSize*100)}"/><a:buFont typeface="${family}"/>`);
+      });
+      // PptxGenJS 4 emits pPr before each rich run. OOXML allows one pPr,
+      // before all runs. Paragraph options belong to the first run.
+      xml=xml.replace(/<a:p>([\s\S]*?)<\/a:p>/g,(_,body)=>{
+        let properties='';
+        const content=body.replace(/<a:pPr\b[^>]*(?:\/>|>[\s\S]*?<\/a:pPr>)/g,node=>{properties ||= node;return '';});
+        return `<a:p>${properties}${content}</a:p>`;
+      });
+    }
+    return encodeText(normalizePartReferences(xml, renameMaps));
   }
   return bytes;
 }
@@ -1652,7 +1676,7 @@ function numberedFilenameMap(paths, pattern) {
 }
 
 function normalizePartPath(path, renameMaps) {
-  return normalizePartReferences(path, renameMaps);
+  return normalizePartReferences(renameMaps.media?.get(path) ?? path, renameMaps);
 }
 
 function normalizePartReferences(value, renameMaps) {
@@ -1666,6 +1690,14 @@ function normalizePartReferences(value, renameMaps) {
       `Microsoft_Excel_Worksheet${newId}.xlsx`
     );
   }
+  // Rewrite package references only, not user-visible text containing paths.
+  output = output.replace(/\b(Target|PartName)="([^"]+)"/g, (attribute, name, value) => {
+    const prefix = value.startsWith('../media/') ? '../' : value.startsWith('/ppt/media/') ? '/ppt/' : null;
+    if (!prefix) return attribute;
+    const part = 'ppt/' + value.slice(prefix.length);
+    const target = renameMaps.media?.get(part);
+    return target ? `${name}="${prefix}${target.slice('ppt/'.length)}"` : attribute;
+  });
   return output;
 }