pptx-react-viewer 2.6.0 → 2.6.2

package/dist/{chunk-PENV7S7Z.mjs → chunk-Y4TIW2MM.mjs}

@@ -1,4 +1,4 @@
-import { ThemePresets, PptxMarkdownConverter } from './chunk-34ZW32XK.mjs';
+import { ThemePresets, PptxMarkdownConverter } from './chunk-Y6H2RSLB.mjs';
 import { __export } from './chunk-XGB3TDIC.mjs';
 import * as mcp from 'pptx-viewer-mcp';
 import * as mcpSchemas from 'pptx-viewer-mcp/schemas';

package/dist/{chunk-34ZW32XK.mjs → chunk-Y6H2RSLB.mjs}

@@ -64359,18 +64359,6 @@ var PptxHandlerRuntime67 = class _PptxHandlerRuntime30 extends PptxHandlerRuntim
       if (hasShapeProperties(el) && el.shapeStyle?.strokeWidth) {
         el.shapeStyle.strokeWidth *= avgScale;
       }
-      if (hasTextProperties(el)) {
-        if (el.textStyle?.fontSize) {
-          el.textStyle.fontSize *= Math.abs(scaleY);
-        }
-        if (el.textSegments) {
-          el.textSegments.forEach((seg) => {
-            if (seg.style.fontSize) {
-              seg.style.fontSize *= Math.abs(scaleY);
-            }
-          });
-        }
-      }
       return el;
     };
     this.unwrapAlternateContent(group);
@@ -98367,14 +98355,14 @@ function matchMorphElementsFull(fromSlide, toSlide) {
     }
   }
   for (const fromEl of fromSlide.elements) {
-    if (usedFrom.has(fromEl.id)) {
+    if (usedFrom.has(fromEl.id) || !fromEl.shapeId) {
       continue;
     }
     for (const toEl of toSlide.elements) {
       if (usedTo.has(toEl.id)) {
         continue;
       }
-      if (fromEl.id === toEl.id) {
+      if (toEl.shapeId && fromEl.shapeId === toEl.shapeId && fromEl.type === toEl.type) {
         pairs2.push({ fromElement: fromEl, toElement: toEl });
         usedFrom.add(fromEl.id);
         usedTo.add(toEl.id);
@@ -98615,6 +98603,37 @@ function buildStrokeInterpolationProps(fromElement, toElement) {
     toWidth
   };
 }
+var SIGNATURE_MAX_DEPTH = 8;
+function appearanceSignature(element, depth = 0) {
+  const parts = [element.type];
+  if (hasShapeProperties(element)) {
+    const style = element.shapeStyle;
+    parts.push(
+      element.shapeType ?? "",
+      style?.fillMode ?? "",
+      style?.fillColor ?? "",
+      style?.fillGradient ?? "",
+      String(style?.fillOpacity ?? ""),
+      style?.strokeColor ?? "",
+      String(style?.strokeWidth ?? "")
+    );
+  }
+  const image = element;
+  parts.push(image.imagePath ?? "", image.svgPath ?? "");
+  if (hasTextProperties(element)) {
+    parts.push(element.text ?? "", element.textStyle?.color ?? "");
+  }
+  const children8 = element.children;
+  if (children8 && depth < SIGNATURE_MAX_DEPTH) {
+    for (const child22 of children8) {
+      parts.push(appearanceSignature(child22, depth + 1));
+    }
+  }
+  return parts.join("
");
+}
+function morphPairNeedsCrossfade(fromElement, toElement) {
+  return appearanceSignature(fromElement) !== appearanceSignature(toElement);
+}
 function generateMorphAnimations(pairs2, durationMs, _mode = "object") {
   const animations = [];
   for (let index = 0; index < pairs2.length; index++) {
@@ -98627,9 +98646,10 @@ function generateMorphAnimations(pairs2, durationMs, _mode = "object") {
     const dr = (fromElement.rotation ?? 0) - (toElement.rotation ?? 0);
     const fromOpacity = fromElement.opacity ?? 1;
     const toOpacity = toElement.opacity ?? 1;
+    const crossfades = morphPairNeedsCrossfade(fromElement, toElement);
     const fromProps = [
       `		transform: translate(${dx}px, ${dy}px) scale(${sx}, ${sy}) rotate(${dr}deg);`,
-      `		opacity: ${fromOpacity};`
+      `		opacity: ${crossfades ? 0 : fromOpacity};`
     ];
     const toProps = [
       "		transform: translate(0, 0) scale(1, 1) rotate(0deg);",
@@ -98662,6 +98682,40 @@ ${toProps.join("\n")}
   }
   return animations;
 }
+function generateMorphGhostAnimations(pairs2, durationMs, startIndex) {
+  const animations = [];
+  for (let index = 0; index < pairs2.length; index++) {
+    const { fromElement, toElement } = pairs2[index];
+    const fadesOut = morphPairNeedsCrossfade(fromElement, toElement);
+    const safeName = `pptx-morph-ghost-${startIndex + index}-${fromElement.id.replace(/[^a-zA-Z0-9]/gu, "")}`;
+    const dx = toElement.x - fromElement.x;
+    const dy = toElement.y - fromElement.y;
+    const sx = Math.max(toElement.width, 1) / Math.max(fromElement.width, 1);
+    const sy = Math.max(toElement.height, 1) / Math.max(fromElement.height, 1);
+    const dr = (toElement.rotation ?? 0) - (fromElement.rotation ?? 0);
+    const originX = fromElement.x + fromElement.width / 2;
+    const originY = fromElement.y + fromElement.height / 2;
+    const keyframes = `
+@keyframes ${safeName} {
+	from {
+		transform-origin: ${originX}px ${originY}px;
+		transform: translate(0, 0) scale(1, 1) rotate(0deg);
+		opacity: ${fromElement.opacity ?? 1};
+	}
+	to {
+		transform-origin: ${originX}px ${originY}px;
+		transform: translate(${dx}px, ${dy}px) scale(${sx}, ${sy}) rotate(${dr}deg);
+		opacity: ${fadesOut ? 0 : fromElement.opacity ?? 1};
+	}
+}`;
+    animations.push({
+      elementId: fromElement.id,
+      animation: `${safeName} ${durationMs}ms ${MORPH_EASING} forwards`,
+      keyframes
+    });
+  }
+  return animations;
+}
 function generateUnmatchedFadeOutAnimations(elements, durationMs, startIndex) {
   return elements.map((el, i) => {
     const safeName = `pptx-morph-fadeout-${startIndex + i}-${el.id.replace(/[^a-zA-Z0-9]/gu, "")}`;
@@ -98739,16 +98793,18 @@ function generateFullMorphTransition(fromSlide, toSlide, durationMs, mode = "obj
       }
     }
   }
+  const ghosts = generateMorphGhostAnimations(matchResult.pairs, durationMs, pairAnims.length);
+  allAnimations.push(...ghosts);
   const fadeOuts = generateUnmatchedFadeOutAnimations(
     matchResult.unmatchedFrom,
     durationMs,
-    pairAnims.length
+    pairAnims.length + ghosts.length
   );
   allAnimations.push(...fadeOuts);
   const fadeIns = generateUnmatchedFadeInAnimations(
     matchResult.unmatchedTo,
     durationMs,
-    pairAnims.length + fadeOuts.length
+    pairAnims.length + ghosts.length + fadeOuts.length
   );
   allAnimations.push(...fadeIns);
   return allAnimations;
@@ -98771,7 +98827,8 @@ function buildMorphTransitionPlan(fromSlide, toSlide, durationMs, mode = "object
     return void 0;
   }
   const animations = generateFullMorphTransition(fromSlide, toSlide, durationMs, mode);
-  const outgoingIds = new Set(match.unmatchedFrom.map((element) => element.id));
+  const outgoingElements = [...fromSlide.elements];
+  const outgoingIds = new Set(outgoingElements.map((element) => element.id));
   const incomingAnimations = /* @__PURE__ */ new Map();
   const outgoingAnimations = /* @__PURE__ */ new Map();
   const keyframes = [];
@@ -98787,7 +98844,7 @@ function buildMorphTransitionPlan(fromSlide, toSlide, durationMs, mode = "object
     keyframesCss: keyframes.join("\n"),
     incomingAnimations,
     outgoingAnimations,
-    outgoingElements: match.unmatchedFrom,
+    outgoingElements,
     durationMs
   };
 }

package/dist/index.js

@@ -1,46 +1,46 @@
 'use strict';
 
-var chunkV5XVTKFS_js = require('./chunk-V5XVTKFS.js');
-require('./chunk-VBWWICDF.js');
-var chunkEJ24IFPL_js = require('./chunk-EJ24IFPL.js');
-var chunkNXSAYLYI_js = require('./chunk-NXSAYLYI.js');
+var chunkTMU7Z3CU_js = require('./chunk-TMU7Z3CU.js');
+require('./chunk-IGYK3NK5.js');
+var chunkW27U3GQS_js = require('./chunk-W27U3GQS.js');
+var chunkXROVGBFQ_js = require('./chunk-XROVGBFQ.js');
 var chunk25VSL2BB_js = require('./chunk-25VSL2BB.js');
-var chunkUVA55CRK_js = require('./chunk-UVA55CRK.js');
+var chunkG7PJSVUS_js = require('./chunk-G7PJSVUS.js');
 require('./chunk-4VNS5WPM.js');
 
 
 
 Object.defineProperty(exports, "PowerPointViewer", {
   enumerable: true,
-  get: function () { return chunkV5XVTKFS_js.PowerPointViewer; }
+  get: function () { return chunkTMU7Z3CU_js.PowerPointViewer; }
 });
 Object.defineProperty(exports, "SlideCanvas", {
   enumerable: true,
-  get: function () { return chunkV5XVTKFS_js.SlideCanvas; }
+  get: function () { return chunkTMU7Z3CU_js.SlideCanvas; }
 });
 Object.defineProperty(exports, "Toolbar", {
   enumerable: true,
-  get: function () { return chunkV5XVTKFS_js.Toolbar; }
+  get: function () { return chunkTMU7Z3CU_js.Toolbar; }
 });
 Object.defineProperty(exports, "ViewerThemeProvider", {
   enumerable: true,
-  get: function () { return chunkV5XVTKFS_js.ViewerThemeProvider; }
+  get: function () { return chunkTMU7Z3CU_js.ViewerThemeProvider; }
 });
 Object.defineProperty(exports, "useViewerTheme", {
   enumerable: true,
-  get: function () { return chunkV5XVTKFS_js.useViewerTheme; }
+  get: function () { return chunkTMU7Z3CU_js.useViewerTheme; }
 });
 Object.defineProperty(exports, "renderToCanvas", {
   enumerable: true,
-  get: function () { return chunkEJ24IFPL_js.renderToCanvas; }
+  get: function () { return chunkW27U3GQS_js.renderToCanvas; }
 });
 Object.defineProperty(exports, "useViewerBuildingBlocks", {
   enumerable: true,
-  get: function () { return chunkEJ24IFPL_js.useViewerBuildingBlocks; }
+  get: function () { return chunkW27U3GQS_js.useViewerBuildingBlocks; }
 });
 Object.defineProperty(exports, "getAnimationInitialStyle", {
   enumerable: true,
-  get: function () { return chunkNXSAYLYI_js.getAnimationInitialStyle; }
+  get: function () { return chunkXROVGBFQ_js.getAnimationInitialStyle; }
 });
 Object.defineProperty(exports, "LOCALE_CATALOG", {
   enumerable: true,
@@ -48,85 +48,85 @@ Object.defineProperty(exports, "LOCALE_CATALOG", {
 });
 Object.defineProperty(exports, "AVATAR_COLOR_SWATCHES", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.AVATAR_COLOR_SWATCHES; }
+  get: function () { return chunkG7PJSVUS_js.AVATAR_COLOR_SWATCHES; }
 });
 Object.defineProperty(exports, "DEFAULT_VIEWER_PROFILE", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.DEFAULT_VIEWER_PROFILE; }
+  get: function () { return chunkG7PJSVUS_js.DEFAULT_VIEWER_PROFILE; }
 });
 Object.defineProperty(exports, "THEME_CATALOG", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.THEME_CATALOG; }
+  get: function () { return chunkG7PJSVUS_js.THEME_CATALOG; }
 });
 Object.defineProperty(exports, "VIEWER_PREFS_STORAGE_KEY", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.VIEWER_PREFS_STORAGE_KEY; }
+  get: function () { return chunkG7PJSVUS_js.VIEWER_PREFS_STORAGE_KEY; }
 });
 Object.defineProperty(exports, "clearAllLocalViewerData", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.clearAllLocalViewerData; }
+  get: function () { return chunkG7PJSVUS_js.clearAllLocalViewerData; }
 });
 Object.defineProperty(exports, "clearStoredViewerPrefs", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.clearStoredViewerPrefs; }
+  get: function () { return chunkG7PJSVUS_js.clearStoredViewerPrefs; }
 });
 Object.defineProperty(exports, "defaultCssVars", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.defaultCssVars; }
+  get: function () { return chunkG7PJSVUS_js.defaultCssVars; }
 });
 Object.defineProperty(exports, "defaultRadius", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.defaultRadius; }
+  get: function () { return chunkG7PJSVUS_js.defaultRadius; }
 });
 Object.defineProperty(exports, "defaultThemeColors", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.defaultThemeColors; }
+  get: function () { return chunkG7PJSVUS_js.defaultThemeColors; }
 });
 Object.defineProperty(exports, "getLocalStorageUsageSummary", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.getLocalStorageUsageSummary; }
+  get: function () { return chunkG7PJSVUS_js.getLocalStorageUsageSummary; }
 });
 Object.defineProperty(exports, "readStoredViewerPrefs", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.readStoredViewerPrefs; }
+  get: function () { return chunkG7PJSVUS_js.readStoredViewerPrefs; }
 });
 Object.defineProperty(exports, "resolveProfileInitial", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.resolveProfileInitial; }
+  get: function () { return chunkG7PJSVUS_js.resolveProfileInitial; }
 });
 Object.defineProperty(exports, "resolveThemeCatalogEntry", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.resolveThemeCatalogEntry; }
+  get: function () { return chunkG7PJSVUS_js.resolveThemeCatalogEntry; }
 });
 Object.defineProperty(exports, "saveViewerProfile", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.saveViewerProfile; }
+  get: function () { return chunkG7PJSVUS_js.saveViewerProfile; }
 });
 Object.defineProperty(exports, "themeToCssVars", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.themeToCssVars; }
+  get: function () { return chunkG7PJSVUS_js.themeToCssVars; }
 });
 Object.defineProperty(exports, "vermilionDarkColors", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.vermilionDarkColors; }
+  get: function () { return chunkG7PJSVUS_js.vermilionDarkColors; }
 });
 Object.defineProperty(exports, "vermilionDarkTheme", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.vermilionDarkTheme; }
+  get: function () { return chunkG7PJSVUS_js.vermilionDarkTheme; }
 });
 Object.defineProperty(exports, "vermilionLightColors", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.vermilionLightColors; }
+  get: function () { return chunkG7PJSVUS_js.vermilionLightColors; }
 });
 Object.defineProperty(exports, "vermilionLightTheme", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.vermilionLightTheme; }
+  get: function () { return chunkG7PJSVUS_js.vermilionLightTheme; }
 });
 Object.defineProperty(exports, "vermilionRadius", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.vermilionRadius; }
+  get: function () { return chunkG7PJSVUS_js.vermilionRadius; }
 });
 Object.defineProperty(exports, "writeStoredViewerPrefs", {
   enumerable: true,
-  get: function () { return chunkUVA55CRK_js.writeStoredViewerPrefs; }
+  get: function () { return chunkG7PJSVUS_js.writeStoredViewerPrefs; }
 });

package/dist/index.mjs

@@ -1,7 +1,7 @@
-export { PowerPointViewer, SlideCanvas, Toolbar, ViewerThemeProvider, useViewerTheme } from './chunk-UO55N46T.mjs';
-import './chunk-PENV7S7Z.mjs';
-export { renderToCanvas, useViewerBuildingBlocks } from './chunk-WCO3NEH5.mjs';
-export { getAnimationInitialStyle } from './chunk-DWQJW3UM.mjs';
+export { PowerPointViewer, SlideCanvas, Toolbar, ViewerThemeProvider, useViewerTheme } from './chunk-LJPRMPNA.mjs';
+import './chunk-Y4TIW2MM.mjs';
+export { renderToCanvas, useViewerBuildingBlocks } from './chunk-MQYNBEOY.mjs';
+export { getAnimationInitialStyle } from './chunk-UV5R7IQY.mjs';
 export { LOCALE_CATALOG } from './chunk-Z6HIZWIQ.mjs';
-export { AVATAR_COLOR_SWATCHES, DEFAULT_VIEWER_PROFILE, THEME_CATALOG, VIEWER_PREFS_STORAGE_KEY, clearAllLocalViewerData, clearStoredViewerPrefs, defaultCssVars, defaultRadius, defaultThemeColors, getLocalStorageUsageSummary, readStoredViewerPrefs, resolveProfileInitial, resolveThemeCatalogEntry, saveViewerProfile, themeToCssVars, vermilionDarkColors, vermilionDarkTheme, vermilionLightColors, vermilionLightTheme, vermilionRadius, writeStoredViewerPrefs } from './chunk-34ZW32XK.mjs';
+export { AVATAR_COLOR_SWATCHES, DEFAULT_VIEWER_PROFILE, THEME_CATALOG, VIEWER_PREFS_STORAGE_KEY, clearAllLocalViewerData, clearStoredViewerPrefs, defaultCssVars, defaultRadius, defaultThemeColors, getLocalStorageUsageSummary, readStoredViewerPrefs, resolveProfileInitial, resolveThemeCatalogEntry, saveViewerProfile, themeToCssVars, vermilionDarkColors, vermilionDarkTheme, vermilionLightColors, vermilionLightTheme, vermilionRadius, writeStoredViewerPrefs } from './chunk-Y6H2RSLB.mjs';
 import './chunk-XGB3TDIC.mjs';

package/dist/internals.d.ts

@@ -8488,9 +8488,11 @@ interface MorphTransitionPlan {
   /** Outgoing-slide element id -> CSS `animation` shorthand. */
   outgoingAnimations: Map<string, string>;
   /**
-   * Outgoing-slide elements with no counterpart on the incoming slide. The
-   * binding must render these itself (they exist nowhere else) for the
-   * duration of the transition so they can fade out.
+   * The outgoing slide's elements, in document order, for the binding to
+   * render in its transition overlay for the duration of the morph. Each one
+   * carries an entry in {@link MorphTransitionPlan.outgoingAnimations}: it
+   * either fades out in place (no counterpart) or glides onto its counterpart,
+   * dissolving into it when the appearance changed.
    */
   outgoingElements: PptxElement[];
   /** Animation duration in ms, echoed for convenience. */