pptx-react-viewer 2.13.1 → 2.14.0

package/dist/{chunk-H5H57XMH.mjs → chunk-T4NHPN76.mjs}

@@ -1,7 +1,7 @@
-import { cloneHistorySnapshot, MIN_ELEMENT_SIZE, ZOOM_TO_SELECTION_PADDING, DEFAULT_CANVAS_HEIGHT, DEFAULT_CANVAS_WIDTH, partitionTemplateElements, UNGROUPED_SECTION_ID, buildSaveSlides, DEFAULT_TABLE_ROWS, DEFAULT_TABLE_COLUMNS, executeMediaCommand, buildPdfFromImageData, buildNotesPdf, EMU_PER_PX, GRID_SIZE, DEFAULT_TEXT_FONT_SIZE } from './chunk-GJEH27GD.mjs';
-import { translationsEn } from './chunk-TEXIGSA6.mjs';
-import { TOOLBAR_TABS, computeVirtualRange, DEFAULT_VIRTUAL_OVERSCAN, BROADCAST_THROTTLE_MS, createSyncGate, clearLocalAwareness, validateRoomId, createDepartureChannel, resolveTransportForServerUrl, isMixedContentBlocked, CONNECTION_TIMEOUT_MS, registerCollaborationTeardown, sanitizeColor, cloneTemplateElementsBySlideId, cloneSlide, clampZoomScale, zoomInScale, zoomOutScale, PresentationAnimationController, computeEntranceAnimationDelay, PRESENTATION_HASH, PRESENTATION_NONCE_KEY, PRESENTATION_CHANNEL_NAME, swapPresentationWindows, PRESENTATION_MESSAGE_ORIGIN, clearAudienceContent, buildPresentationAudienceUrl, resolveAudienceScreenPlacement, placeAudienceWindow, storeAudienceContent, isPresentationSessionMessage, endAudienceDisplay, createPresentationKeyBuffer, acceptsPresentationInput, resolveAutoAdvanceDelayMs, hasShowSlideAfter, nextShowSlideIndex, previousShowSlideIndex, createPresenterShowGuard, attachPresentationVisibilityPause, buildMorphTransitionPlan, morphOptionToMode, createCollaborationLivePatcher, publishLiveInlineText, PptxHandler, collectMediaElements, collectImagePaths, buildInitialGuides, EncryptedFileError, saveAutosaveSnapshot, isTemplateElementId, hasShapeProperties, hasTextProperties, getInlineEditorSelection, applyStyleToSelectedSegments, setPendingSelectionRestore, applyCaseTransformToSegments, transformTextCase, addSection, renameSection, deleteSection, moveSectionUp, moveSectionDown, moveSlidesToSection, normalizeColorsForCapture, preprocessCssForCapture, downloadBlob, sanitizeDownloadFilename, slideProgressPercent, slideStatusLabel, EXPORT_ASSEMBLING_PERCENT, EXPORT_DONE_PERCENT, isExportAbortError, recordProgressPercent, applyThemeToData, THEME_PRESETS, themeColorSchemesEqual, comparePresentation, applyAcceptSlide, applyAcceptAllSlides, collectUsedFonts, detectTouchDevice, detectOrientation, isMobileViewport, MOBILE_BREAKPOINT, TABLET_BREAKPOINT, mayLeaveSlideShow, stopAllPersistentAudio, remapTextToSegments, guidePxToEmu, shouldLoopContinuously, applyRehearsalTimings, copyFormatFromElement, applyFormatToElement, mapEditorKey, isEditorTextInputTarget, createViewerOptionsStore, readSlidesFromYDoc, reconcileSlidesInYDoc, LOCAL_SYNC_ORIGIN, observeYDocSlides, shouldAutoFollowBroadcaster, createTouchGestureRecognizer, MAX_ZOOM_SCALE, MIN_ZOOM_SCALE, isKeyboardOpen, openPptxFile, readBackstageRecentFile, isActionHidden, buildElementClipboardPayload, generatePackageReadme, groupElements, generateElementId, makeCloneId, alignElements, distributeElements, bringForward, sendBackward, bringToFront, sendToBack, newTableElement, createDefaultChartElement, readViewportMetrics, computeKeyboardInset, mergeShapes, derivePresenceList, mapPresentationKey, lastShowSlideIndex, firstShowSlideIndex, buildPrintDocument, buildOutlineHtml, buildSlidesHtml, buildNotesHtml, buildHandoutsHtml, createBlankSlide, makeSlideId, buildThemeColorMap, reResolveSlideColors, createPresentationSessionId, resolveTransitionDurationMs, runPresentationAction, createPresenterTimer, createInitialPresentationSnapshot, mergePresentationSnapshot, presenterElapsed, stepPresenterZoom, resetPresenterTimer, togglePresenterTimer, canvasToJpegData, downloadDataUrl, pickSupportedMimeType, WEBM_MIME_CANDIDATES, fpsToFrameIntervalMs, segmentFrameCount, encodeGif, resolveShowSlideIndexes, groupSlidesBySection, hasCopyableFormat, createBackstagePresentation, buildFieldSubstitutionContext, cloneElementForPaste, computeScrollDelta, getPresetShapeClipPath, svgPathToPolygons, polygonsToSvgPath, rerouteConnectorsForMovedElements, applyReroutedConnectors, SvgExporter, buildPrintHtmlDocument, deleteTableColumn, rebuildTableStructureInRawXml, insertTableColumn, deleteTableRow, insertTableRow, updateCellTextStyleInRawXml, updateCellTextInRawXml, splitCell, updateMergeAttrsInRawXml, mergeCells, isPpactionUrl, parsePpactionUrl, safeOpenUrl, ACTION_BUTTON_PRESETS, elementActionToPptxAction, buildSmartArtPresetData, computeSnapToShape, publishLiveGeometry, computeMarqueeHitIds, mergeAdditiveSelection, applyResize, snapBoxToGrid, applyMotionPathPreset } from './chunk-OWGPRVRK.mjs';
-import { useRef, useState, useEffect, useCallback, useMemo, useSyncExternalStore, useImperativeHandle } from 'react';
+import { cloneHistorySnapshot, MIN_ELEMENT_SIZE, ZOOM_TO_SELECTION_PADDING, DEFAULT_CANVAS_HEIGHT, DEFAULT_CANVAS_WIDTH, partitionTemplateElements, UNGROUPED_SECTION_ID, buildSaveSlides, DEFAULT_TABLE_ROWS, DEFAULT_TABLE_COLUMNS, executeMediaCommand, buildPdfFromImageData, buildNotesPdf, EMU_PER_PX, GRID_SIZE, DEFAULT_TEXT_FONT_SIZE } from './chunk-R7MGJCZN.mjs';
+import { translationsEn } from './chunk-5YV26HMJ.mjs';
+import { TOOLBAR_TABS, computeVirtualRange, DEFAULT_VIRTUAL_OVERSCAN, createPresenceProjector, BROADCAST_THROTTLE_MS, createSyncGate, clearLocalAwareness, validateRoomId, createDepartureChannel, resolveTransportForServerUrl, isMixedContentBlocked, CONNECTION_TIMEOUT_MS, registerCollaborationTeardown, sanitizeColor, cloneTemplateElementsBySlideId, cloneSlide, createViewerZoomStore, clampZoomScale, PresentationAnimationController, PRESENTATION_HASH, PRESENTATION_NONCE_KEY, PRESENTATION_CHANNEL_NAME, swapPresentationWindows, PRESENTATION_MESSAGE_ORIGIN, clearAudienceContent, buildPresentationAudienceUrl, resolveAudienceScreenPlacement, placeAudienceWindow, storeAudienceContent, isPresentationSessionMessage, endAudienceDisplay, createPresentationKeyBuffer, acceptsPresentationInput, resolveAutoAdvanceDelayMs, hasShowSlideAfter, nextShowSlideIndex, previousShowSlideIndex, createPresenterShowGuard, attachPresentationVisibilityPause, buildMorphTransitionPlan, morphOptionToMode, createCollaborationLivePatcher, publishLiveInlineText, PptxHandler, collectMediaElements, collectImagePaths, buildInitialGuides, EncryptedFileError, saveAutosaveSnapshot, isTemplateElementId, hasShapeProperties, hasTextProperties, getInlineEditorSelection, applyStyleToSelectedSegments, setPendingSelectionRestore, applyCaseTransformToSegments, transformTextCase, addSection, renameSection, deleteSection, moveSectionUp, moveSectionDown, moveSlidesToSection, normalizeColorsForCapture, preprocessCssForCapture, downloadBlob, sanitizeDownloadFilename, slideProgressPercent, slideStatusLabel, EXPORT_ASSEMBLING_PERCENT, EXPORT_DONE_PERCENT, isExportAbortError, recordProgressPercent, applyThemeToData, THEME_PRESETS, themeColorSchemesEqual, comparePresentation, applyAcceptSlide, applyAcceptAllSlides, collectUsedFonts, detectTouchDevice, detectOrientation, isMobileViewport, MOBILE_BREAKPOINT, TABLET_BREAKPOINT, mayLeaveSlideShow, stopAllPersistentAudio, remapTextToSegments, guidePxToEmu, shouldLoopContinuously, applyRehearsalTimings, copyFormatFromElement, applyFormatToElement, mapEditorKey, isEditorTextInputTarget, createViewerOptionsStore, readSlidesFromYDoc, reconcileSlidesInYDoc, LOCAL_SYNC_ORIGIN, observeYDocSlides, shouldAutoFollowBroadcaster, createTouchGestureRecognizer, MAX_ZOOM_SCALE, MIN_ZOOM_SCALE, isKeyboardOpen, openPptxFile, readBackstageRecentFile, isActionHidden, buildElementClipboardPayload, generatePackageReadme, exportDeckJson, groupElements, generateElementId, makeCloneId, alignElements, distributeElements, bringForward, sendBackward, bringToFront, sendToBack, newTableElement, createDefaultChartElement, readViewportMetrics, computeKeyboardInset, mergeShapes, mapPresentationKey, lastShowSlideIndex, firstShowSlideIndex, buildPrintDocument, buildOutlineHtml, buildSlidesHtml, buildNotesHtml, buildHandoutsHtml, createBlankSlide, makeSlideId, buildSlideTemplateSlide, templateSchemeFromTheme, buildThemeColorMap, reResolveSlideColors, computeEntranceAnimationDelay, createPresentationSessionId, resolveTransitionDurationMs, runPresentationAction, createPresenterTimer, createInitialPresentationSnapshot, mergePresentationSnapshot, resetPresenterTimer, presenterElapsed, stepPresenterZoom, togglePresenterTimer, canvasToJpegData, downloadDataUrl, pickSupportedMimeType, WEBM_MIME_CANDIDATES, fpsToFrameIntervalMs, segmentFrameCount, encodeGif, resolveShowSlideIndexes, groupSlidesBySection, hasCopyableFormat, createBackstagePresentation, buildFieldSubstitutionContext, cloneElementForPaste, computeScrollDelta, getPresetShapeClipPath, svgPathToPolygons, polygonsToSvgPath, rerouteConnectorsForMovedElements, applyReroutedConnectors, SvgExporter, buildPrintHtmlDocument, deleteTableColumn, rebuildTableStructureInRawXml, insertTableColumn, deleteTableRow, insertTableRow, updateCellTextStyleInRawXml, updateCellTextInRawXml, splitCell, updateMergeAttrsInRawXml, mergeCells, isPpactionUrl, parsePpactionUrl, safeOpenUrl, ACTION_BUTTON_PRESETS, elementActionToPptxAction, buildSmartArtPresetData, computeSnapToShape, publishLiveGeometry, computeMarqueeHitIds, mergeAdditiveSelection, applyResize, snapBoxToGrid, applyMotionPathPreset } from './chunk-5MMC7ZR3.mjs';
+import { useRef, useState, useEffect, useCallback, useMemo, useLayoutEffect, useSyncExternalStore, useImperativeHandle } from 'react';
 import JSZip from 'jszip';
 import { useTranslation } from 'react-i18next';
 
@@ -78,6 +78,9 @@ function usePresenceTracking({
   canvasHeight
 }) {
   const [remoteUsers, setRemoteUsers] = useState([]);
+  const projectorRef = useRef(null);
+  projectorRef.current ??= createPresenceProjector();
+  const projector = projectorRef.current;
   const lastBroadcastRef = useRef(0);
   const pendingBroadcastRef = useRef(null);
   const latestLocalState = useRef({});
@@ -136,13 +139,16 @@ function usePresenceTracking({
       return;
     }
     const handleChange = () => {
-      const users = derivePresenceList(
+      const { list, changed } = projector.project(
         awareness.getStates(),
         localClientId,
         canvasWidth,
         canvasHeight
       );
-      setRemoteUsers(users);
+      if (!changed) {
+        return;
+      }
+      setRemoteUsers(list);
     };
     awareness.on("change", handleChange);
     awareness.on("update", handleChange);
@@ -151,7 +157,7 @@ function usePresenceTracking({
       awareness.off("change", handleChange);
       awareness.off("update", handleChange);
     };
-  }, [awareness, localClientId, canvasWidth, canvasHeight]);
+  }, [awareness, localClientId, canvasWidth, canvasHeight, projector]);
   useEffect(() => {
     if (!awareness) {
       return;
@@ -684,6 +690,28 @@ function useEditorHistory(input) {
     buildHistorySnapshot
   };
 }
+function useViewerStore(store, selector, isEqual = Object.is) {
+  const cache = useRef(null);
+  const getSnapshot2 = useCallback(() => {
+    const state = store.getState();
+    const last = cache.current;
+    if (last && Object.is(last.state, state)) {
+      return last.value;
+    }
+    const next = selector(state);
+    const value = last && isEqual(last.value, next) ? last.value : next;
+    cache.current = { state, value };
+    return value;
+  }, [store, selector, isEqual]);
+  const subscribe2 = useCallback(
+    (onStoreChange) => store.subscribe(onStoreChange),
+    [store]
+  );
+  return useSyncExternalStore(subscribe2, getSnapshot2, getSnapshot2);
+}
+
+// src/viewer/hooks/useZoomViewport.ts
+var selectZoom = (state) => state.zoom;
 function useZoomViewport({
   canvasSize,
   selectedElements
@@ -692,7 +720,14 @@ function useZoomViewport({
   const canvasStageRef = useRef(null);
   const canvasViewportRef = useRef(null);
   const renderScaleRef = useRef(1);
-  const [scale, setScale] = useState(1);
+  const storeRef = useRef(null);
+  storeRef.current ??= createViewerZoomStore();
+  const store = storeRef.current;
+  const scale = useViewerStore(store, selectZoom);
+  const setScale = useCallback(
+    (next) => store.dispatch({ type: "set-zoom", zoom: next }),
+    [store]
+  );
   const [editorDimensions, setEditorDimensions] = useState(null);
   const effectiveEditorDimensions = editorDimensions || {
     width: canvasSize.width,
@@ -710,6 +745,9 @@ function useZoomViewport({
   useEffect(() => {
     renderScaleRef.current = editorScale;
   }, [editorScale]);
+  useEffect(() => {
+    store.dispatch({ type: "set-fit-scale", fitScale });
+  }, [store, fitScale]);
   useEffect(() => {
     let observer = null;
     let raf = 0;
@@ -759,17 +797,17 @@ function useZoomViewport({
     [fitScale]
   );
   const handleZoomIn = useCallback(() => {
-    setScale((currentScale) => zoomInScale(currentScale));
-  }, []);
+    store.dispatch({ type: "zoom-in" });
+  }, [store]);
   const handleZoomOut = useCallback(() => {
-    setScale((currentScale) => zoomOutScale(currentScale));
-  }, []);
+    store.dispatch({ type: "zoom-out" });
+  }, [store]);
   const handleResetZoom = useCallback(() => {
-    setScale(1);
-  }, []);
+    store.dispatch({ type: "zoom-to-fit" });
+  }, [store]);
   const handleZoomToFit = useCallback(() => {
-    setScale(1);
-  }, []);
+    store.dispatch({ type: "zoom-to-fit" });
+  }, [store]);
   const handleZoomToSelection = useCallback(() => {
     if (selectedElements.length === 0) {
       return;
@@ -815,16 +853,23 @@ function useZoomViewport({
     effectiveEditorDimensions.height,
     effectiveEditorDimensions.width,
     fitScale,
-    selectedElements
+    selectedElements,
+    setScale
   ]);
-  const handleWheel = useCallback((event) => {
-    if (!event.ctrlKey) {
-      return;
-    }
-    event.preventDefault();
-    const delta = event.deltaY * -1e-3;
-    setScale((currentScale) => clampZoomScale(currentScale + delta));
-  }, []);
+  const handleWheel = useCallback(
+    (event) => {
+      if (!event.ctrlKey) {
+        return;
+      }
+      event.preventDefault();
+      const delta = event.deltaY * -1e-3;
+      store.dispatch({
+        type: "set-zoom",
+        zoom: clampZoomScale(store.getState().zoom + delta)
+      });
+    },
+    [store]
+  );
   useEffect(() => {
     const viewport = canvasViewportRef.current;
     if (!viewport) {
@@ -997,6 +1042,58 @@ function driveBuildReveal(controller, buildIds, setStates, handle) {
   tick();
 }
 
+// src/viewer/hooks/presentation-mode/entrance-animation-timers.ts
+function scheduleOpeningAutoPlayGroup(controller, deps) {
+  if (!controller.hasMoreSteps()) {
+    return;
+  }
+  const firstGroup = controller.peekNext();
+  if (!firstGroup?.autoAdvance) {
+    return;
+  }
+  const timer = window.setTimeout(() => {
+    const group = controller.advance();
+    if (!group) {
+      return;
+    }
+    applyAnimationGroupSteps(
+      group,
+      deps.onPlayActionSound,
+      deps.setPresentationElementStates,
+      deps.presentationTimersRef
+    );
+    deps.startBuildReveal(controller, group);
+    deps.scheduleAutoAdvanceChain(controller);
+  }, firstGroup.autoAdvanceDelayMs ?? 0);
+  deps.presentationTimersRef.current.push(timer);
+}
+function scheduleEntranceAnimationTimers(slide, setPresentationAnimations, presentationTimersRef) {
+  const entranceAnimations = [...slide.animations || []].filter((animation) => Boolean(animation.entrance)).sort(
+    (left, right) => (left.order || Number.MAX_SAFE_INTEGER) - (right.order || Number.MAX_SAFE_INTEGER)
+  );
+  if (entranceAnimations.length === 0) {
+    return;
+  }
+  setPresentationAnimations(
+    entranceAnimations.map((animation) => ({
+      elementId: animation.elementId,
+      state: "hidden",
+      animation
+    }))
+  );
+  entranceAnimations.forEach((animation, animationIndex) => {
+    const delay = computeEntranceAnimationDelay(animation.delayMs, animationIndex);
+    const timer = window.setTimeout(() => {
+      setPresentationAnimations(
+        (previousAnimations) => previousAnimations.map(
+          (entry) => entry.elementId === animation.elementId ? { ...entry, state: "visible" } : entry
+        )
+      );
+    }, delay);
+    presentationTimersRef.current.push(timer);
+  });
+}
+
 // src/viewer/hooks/presentation-mode/useAnimationPlayback.ts
 function useAnimationPlayback(input) {
   const { slides, onPlayActionSound, showWithAnimation } = input;
@@ -1012,6 +1109,7 @@ function useAnimationPlayback(input) {
   const controllerRef = useRef(null);
   const buildRafRef = useRef(null);
   const seededCompletedRef = useRef(false);
+  const lastSeedCompletedRef = useRef(false);
   const startBuildReveal = useCallback(
     (controller, group) => {
       driveBuildReveal(
@@ -1163,12 +1261,12 @@ function useAnimationPlayback(input) {
     }
     controller.resetHover(shapeId);
   }, []);
-  const runPresentationEntranceAnimations = useCallback(
+  const seedSlideAnimations = useCallback(
     (slideIndex, options) => {
       clearPresentationTimers();
+      setPresentationAnimations([]);
       if (!animationsEnabled) {
         controllerRef.current = null;
-        setPresentationAnimations([]);
         setPresentationElementStates(/* @__PURE__ */ new Map());
         setPresentationKeyframesCss("");
         setInteractiveTriggerShapeIds(/* @__PURE__ */ new Set());
@@ -1176,12 +1274,8 @@ function useAnimationPlayback(input) {
         return;
       }
       resetSlideTimeline(slideIndex);
-      const slide = slides[slideIndex];
-      if (!slide) {
-        setPresentationAnimations([]);
-        return;
-      }
       seededCompletedRef.current = false;
+      lastSeedCompletedRef.current = options?.completed === true;
       if (options?.completed) {
         const seeded = controllerRef.current;
         if (seeded) {
@@ -1189,64 +1283,39 @@ function useAnimationPlayback(input) {
           seeded.completeAll();
           setPresentationElementStates(seeded.computeStates());
         }
-        setPresentationAnimations([]);
-        return;
       }
-      const controller = controllerRef.current;
-      if (controller && controller.hasMoreSteps()) {
-        const firstGroup = controller.peekNext();
-        if (firstGroup && firstGroup.autoAdvance) {
-          const timer = window.setTimeout(() => {
-            const group = controller.advance();
-            if (group) {
-              applyAnimationGroupSteps(
-                group,
-                onPlayActionSound,
-                setPresentationElementStates,
-                presentationTimersRef
-              );
-              startBuildReveal(controller, group);
-              scheduleAutoAdvanceChain(controller);
-            }
-          }, firstGroup.autoAdvanceDelayMs ?? 0);
-          presentationTimersRef.current.push(timer);
-        }
+    },
+    [animationsEnabled, clearPresentationTimers, resetSlideTimeline]
+  );
+  const startSlideAnimations = useCallback(
+    (slideIndex) => {
+      if (!animationsEnabled || lastSeedCompletedRef.current) {
+        return;
       }
-      const entranceAnimations = [...slide.animations || []].filter((animation) => Boolean(animation.entrance)).sort(
-        (left, right) => (left.order || Number.MAX_SAFE_INTEGER) - (right.order || Number.MAX_SAFE_INTEGER)
-      );
-      if (entranceAnimations.length === 0) {
-        setPresentationAnimations([]);
+      const slide = slides[slideIndex];
+      if (!slide) {
         return;
       }
-      setPresentationAnimations(
-        entranceAnimations.map((animation) => ({
-          elementId: animation.elementId,
-          state: "hidden",
-          animation
-        }))
-      );
-      entranceAnimations.forEach((animation, animationIndex) => {
-        const delay = computeEntranceAnimationDelay(animation.delayMs, animationIndex);
-        const timer = window.setTimeout(() => {
-          setPresentationAnimations(
-            (previousAnimations) => previousAnimations.map(
-              (entry) => entry.elementId === animation.elementId ? { ...entry, state: "visible" } : entry
-            )
-          );
-        }, delay);
-        presentationTimersRef.current.push(timer);
-      });
+      const controller = controllerRef.current;
+      if (controller) {
+        scheduleOpeningAutoPlayGroup(controller, {
+          onPlayActionSound,
+          setPresentationElementStates,
+          presentationTimersRef,
+          startBuildReveal,
+          scheduleAutoAdvanceChain
+        });
+      }
+      scheduleEntranceAnimationTimers(slide, setPresentationAnimations, presentationTimersRef);
     },
-    [
-      animationsEnabled,
-      clearPresentationTimers,
-      resetSlideTimeline,
-      slides,
-      onPlayActionSound,
-      scheduleAutoAdvanceChain,
-      startBuildReveal
-    ]
+    [animationsEnabled, slides, onPlayActionSound, scheduleAutoAdvanceChain, startBuildReveal]
+  );
+  const runPresentationEntranceAnimations = useCallback(
+    (slideIndex, options) => {
+      seedSlideAnimations(slideIndex, options);
+      startSlideAnimations(slideIndex);
+    },
+    [seedSlideAnimations, startSlideAnimations]
   );
   return {
     presentationAnimations,
@@ -1260,6 +1329,8 @@ function useAnimationPlayback(input) {
     handleHoverStart,
     handleHoverEnd,
     runPresentationEntranceAnimations,
+    seedSlideAnimations,
+    startSlideAnimations,
     isSeededCompleted: () => seededCompletedRef.current,
     presentationTimersRef
   };
@@ -1809,6 +1880,7 @@ function executeSlideTransition(nextSlideIndex, deps) {
   deps.setPresentationSlideIndex(nextSlideIndex);
   deps.onSetActiveSlideIndex(nextSlideIndex);
   deps.setPresentationSlideVisible(true);
+  deps.seedSlideAnimations(nextSlideIndex, { completed: deps.seedCompleted });
   if (durationMs > 0 && transition) {
     if (transition.soundPath && deps.onPlayActionSound) {
       deps.onPlayActionSound(transition.soundPath, { loop: transition.soundLoop === true });
@@ -1820,16 +1892,14 @@ function executeSlideTransition(nextSlideIndex, deps) {
       durationMs
     });
     const timer = window.setTimeout(() => {
-      deps.runPresentationEntranceAnimations(nextSlideIndex, {
-        completed: deps.seedCompleted
-      });
+      deps.startSlideAnimations(nextSlideIndex);
       deps.scheduleAutoAdvanceForSlide?.(nextSlideIndex);
     }, durationMs);
     deps.presentationTimersRef.current.push(timer);
     return;
   }
   deps.setTransitionOverlay(null);
-  deps.runPresentationEntranceAnimations(nextSlideIndex, { completed: deps.seedCompleted });
+  deps.startSlideAnimations(nextSlideIndex);
   deps.scheduleAutoAdvanceForSlide?.(nextSlideIndex);
 }
 
@@ -1853,7 +1923,8 @@ function useSlideNavigation(input) {
     onAdvancePastLastSlide,
     playNextAnimationGroup,
     clearPresentationTimers,
-    runPresentationEntranceAnimations,
+    seedSlideAnimations,
+    startSlideAnimations,
     presentationTimersRef,
     rehearsing,
     recordCurrentSlideTime,
@@ -1921,7 +1992,8 @@ function useSlideNavigation(input) {
         clearPresentationTimers,
         setPresentationSlideIndex,
         onSetActiveSlideIndex,
-        runPresentationEntranceAnimations,
+        seedSlideAnimations,
+        startSlideAnimations,
         scheduleAutoAdvanceForSlide: rehearsing ? void 0 : scheduleAutoAdvanceForSlide,
         presentationTimersRef,
         setTransitionOverlay,
@@ -1943,7 +2015,8 @@ function useSlideNavigation(input) {
       presentationTimersRef,
       recordCurrentSlideTime,
       rehearsing,
-      runPresentationEntranceAnimations,
+      seedSlideAnimations,
+      startSlideAnimations,
       scheduleAutoAdvanceForSlide,
       setShowRehearsalSummary,
       slides,
@@ -1970,7 +2043,8 @@ function useSlideNavigation(input) {
         clearPresentationTimers,
         setPresentationSlideIndex,
         onSetActiveSlideIndex,
-        runPresentationEntranceAnimations,
+        seedSlideAnimations,
+        startSlideAnimations,
         scheduleAutoAdvanceForSlide,
         presentationTimersRef,
         setTransitionOverlay,
@@ -1990,7 +2064,8 @@ function useSlideNavigation(input) {
       onSetActiveSlideIndex,
       presentationSlideIndex,
       presentationTimersRef,
-      runPresentationEntranceAnimations,
+      seedSlideAnimations,
+      startSlideAnimations,
       scheduleAutoAdvanceForSlide,
       slides,
       setPresentationSlideIndex,
@@ -2046,7 +2121,7 @@ function useZoomNavigation(input) {
     clearZoomReturn
   };
 }
-function usePresenterConsole(slideIndex) {
+function usePresenterConsole(slideIndex, active) {
   const timerRef = useRef(createPresenterTimer());
   const [snapshot, setSnapshot] = useState(() => createInitialPresentationSnapshot(slideIndex));
   const patch = useCallback((value) => {
@@ -2054,6 +2129,11 @@ function usePresenterConsole(slideIndex) {
   }, []);
   useEffect(() => patch({ slideIndex }), [patch, slideIndex]);
   useEffect(() => {
+    if (!active) {
+      return;
+    }
+    timerRef.current = resetPresenterTimer();
+    patch({ paused: false, elapsedMs: 0 });
     const timer = window.setInterval(() => {
       patch({
         paused: timerRef.current.paused,
@@ -2061,7 +2141,7 @@ function usePresenterConsole(slideIndex) {
       });
     }, 1e3);
     return () => window.clearInterval(timer);
-  }, [patch]);
+  }, [active, patch]);
   return {
     snapshot,
     applyAudienceSnapshot: setSnapshot,
@@ -2137,6 +2217,8 @@ function usePresentationMode(input) {
     handleHoverStart,
     handleHoverEnd,
     runPresentationEntranceAnimations,
+    seedSlideAnimations,
+    startSlideAnimations,
     isSeededCompleted,
     presentationTimersRef
   } = useAnimationPlayback({ slides, onPlayActionSound, showWithAnimation });
@@ -2192,7 +2274,8 @@ function usePresentationMode(input) {
     onAdvancePastLastSlide: handleAdvancePastLastSlide,
     playNextAnimationGroup,
     clearPresentationTimers,
-    runPresentationEntranceAnimations,
+    seedSlideAnimations,
+    startSlideAnimations,
     presentationTimersRef,
     rehearsing,
     recordCurrentSlideTime,
@@ -2228,7 +2311,7 @@ function usePresentationMode(input) {
   const { handleZoomClick, zoomReturnSlideIndex, returnToZoomSlide, clearZoomReturn } = useZoomNavigation({ navigateToSlide });
   const openAllSlides = useCallback(() => setAllSlidesOpen(true), []);
   const closeAllSlides = useCallback(() => setAllSlidesOpen(false), []);
-  const presenterConsole = usePresenterConsole(presentationSlideIndex);
+  const presenterConsole = usePresenterConsole(presentationSlideIndex, mode === "present");
   const {
     openAudienceWindow,
     closeAudienceWindow,
@@ -2343,7 +2426,7 @@ function usePresentationMode(input) {
       onVisible: () => scheduleAutoAdvanceRef.current(presentationSlideIndexRef.current)
     });
   }, [mode, containerRef]);
-  useEffect(() => {
+  useLayoutEffect(() => {
     if (mode === "present") {
       const idx = activeSlideIndexRef.current;
       setPresentationSlideIndex(idx);
@@ -5434,11 +5517,11 @@ function useInsertElements(input) {
       id: generateElementId()
     });
   };
-  const handleAddChart = (chartType) => {
+  const handleAddChart = (chartKind) => {
     if (!activeSlide) {
       return;
     }
-    addElement(createDefaultChartElement(chartType));
+    addElement(createDefaultChartElement(chartKind));
   };
   const structured = createStructuredElementHandlers({
     activeSlide,
@@ -6064,7 +6147,16 @@ function insertSlideFromLayoutUpdater(slides, activeIndex, draft) {
   return next;
 }
 function useSlideManagement(input) {
-  const { slides, activeSlideIndex, setActiveSlideIndex, ops, history, handlerRef } = input;
+  const {
+    slides,
+    activeSlideIndex,
+    setActiveSlideIndex,
+    ops,
+    history,
+    handlerRef,
+    canvasSize,
+    theme
+  } = input;
   const handleAddSlide = () => {
     const newSlide = createBlankSlide(slides.length + 1);
     ops.updateSlides((prev) => {
@@ -6192,6 +6284,16 @@ function useSlideManagement(input) {
       );
     }
   };
+  const handleInsertSlideFromTemplate = (templateId) => {
+    const insertAt = activeSlideIndex + 1;
+    const draft = buildSlideTemplateSlide(templateId, makeSlideId(), slides.length + 1, {
+      ...canvasSize ? { slideWidth: canvasSize.width, slideHeight: canvasSize.height } : {},
+      scheme: templateSchemeFromTheme(theme?.colorScheme)
+    });
+    ops.updateSlides((prev) => insertSlideFromLayoutUpdater(prev, activeSlideIndex, draft));
+    setActiveSlideIndex(insertAt);
+    history.markDirty();
+  };
   return {
     handleAddSlide,
     handleMoveSlide,
@@ -6199,7 +6301,8 @@ function useSlideManagement(input) {
     handleDeleteSlides,
     handleDuplicateSlides,
     handleToggleHideSlides,
-    handleInsertSlideFromLayout
+    handleInsertSlideFromLayout,
+    handleInsertSlideFromTemplate
   };
 }
 
@@ -6858,6 +6961,8 @@ function useExportSaveAs(input) {
     handoutMaster,
     guides,
     activeSlideIndexForGuides,
+    theme,
+    canvasSize,
     modalControls,
     password
   } = input;
@@ -6964,6 +7069,32 @@ function useExportSaveAs(input) {
     }
     return handler.save(slidesToSave, saveOptions);
   };
+  const handleExportJson = () => {
+    const sourceName = filePath ? filePath.replace(/\\/gu, "/").split("/").pop() : void 0;
+    const data = {
+      slides: buildSaveSlides(slides, templateElementsBySlideId),
+      width: canvasSize.width,
+      height: canvasSize.height,
+      widthEmu: guidePxToEmu(canvasSize.width),
+      heightEmu: guidePxToEmu(canvasSize.height),
+      theme,
+      headerFooter,
+      presentationProperties,
+      customShows: customShows.length > 0 ? customShows : void 0,
+      sections: sections.length > 0 ? sections : void 0,
+      coreProperties: coreProperties ?? void 0,
+      appProperties: appProperties ?? void 0,
+      customProperties: customProperties.length > 0 ? customProperties : void 0,
+      tags: tagCollections.length > 0 ? tagCollections : void 0,
+      notesMaster,
+      handoutMaster
+    };
+    try {
+      exportDeckJson(data, sourceName);
+    } catch (err) {
+      console.error("[PowerPointViewer] JSON export failed:", err);
+    }
+  };
   const handleSaveAsPptx = () => {
     void handleSaveAsFormat("pptx");
   };
@@ -6974,6 +7105,7 @@ function useExportSaveAs(input) {
     void handleSaveAsFormat("pptm");
   };
   return {
+    handleExportJson,
     handlePackageForSharing,
     handleSaveAsFormat,
     handleSaveAsPptx,
@@ -7025,6 +7157,8 @@ function useExportHandlers(input) {
     handoutMaster,
     guides,
     activeSlideIndexForGuides,
+    theme,
+    canvasSize,
     password
   } = input;
   const [exportModalOpen, setExportModalOpen] = useState(false);
@@ -7040,6 +7174,7 @@ function useExportHandlers(input) {
     exportAbortRef
   };
   const {
+    handleExportJson,
     handlePackageForSharing,
     handleSaveAsFormat,
     handleSaveAsPptx,
@@ -7063,6 +7198,8 @@ function useExportHandlers(input) {
     handoutMaster,
     guides,
     activeSlideIndexForGuides,
+    theme,
+    canvasSize,
     modalControls,
     password
   });
@@ -7273,6 +7410,7 @@ function useExportHandlers(input) {
     handleCopySlideAsImage,
     handleExportVideo,
     handleExportGif,
+    handleExportJson,
     handlePackageForSharing,
     handleSaveAsFormat,
     handleSaveAsPptx,
@@ -8850,7 +8988,9 @@ function useEditorOperations(input) {
     setActiveSlideIndex: state.setActiveSlideIndex,
     ops,
     history,
-    handlerRef
+    handlerRef,
+    canvasSize,
+    theme: state.theme
   });
   const tableOps = useTableOperations({
     selectedElement,
@@ -8987,6 +9127,8 @@ function useIOHandlers(input) {
     handoutMaster: state.handoutMaster,
     guides: state.guides,
     activeSlideIndexForGuides: state.activeSlideIndex,
+    theme: state.theme,
+    canvasSize,
     password
   });
   const printHandlers = usePrintHandlers({
@@ -10634,6 +10776,7 @@ function buildToolbarProps(input) {
     onExportPdf: exportHandlers.handleExportPdf,
     onExportVideo: exportHandlers.handleExportVideo,
     onExportGif: exportHandlers.handleExportGif,
+    onExportJson: exportHandlers.handleExportJson,
     onPackageForSharing: exportHandlers.handlePackageForSharing,
     onOpenFile,
     onOpenRecentFile,
@@ -10664,6 +10807,8 @@ function buildToolbarProps(input) {
     onSetOverflowMenuOpen: s.setIsOverflowMenuOpen,
     layoutOptions: scopedLayoutOptions,
     onInsertSlideFromLayout: slideOps.handleInsertSlideFromLayout,
+    onInsertSlideFromTemplate: slideOps.handleInsertSlideFromTemplate,
+    templateScheme: templateSchemeFromTheme(s.theme?.colorScheme),
     customShows: s.customShows,
     activeCustomShowId: s.activeCustomShowId,
     onSetActiveCustomShowId: s.setActiveCustomShowId,