pptx-react-viewer 3.2.0 → 3.4.0

package/dist/{chunk-UHR7EYFM.mjs → chunk-MSUUPLQ7.mjs}

@@ -1,6 +1,6 @@
-import { cloneHistorySnapshot, MIN_ELEMENT_SIZE, ZOOM_TO_SELECTION_PADDING, DEFAULT_CANVAS_HEIGHT, DEFAULT_CANVAS_WIDTH, UNGROUPED_SECTION_ID, DEFAULT_SECTION_GROUP_ID, DEFAULT_TABLE_ROWS, DEFAULT_TABLE_COLUMNS, executeMediaCommand, buildPdfFromImageData, buildNotesPdf, GRID_SIZE, DEFAULT_TEXT_FONT_SIZE } from './chunk-FMEEIS6L.mjs';
-import { DEFAULT_VIEWER_OPTIONS, TOOLBAR_TABS, computeVirtualRange, DEFAULT_VIRTUAL_OVERSCAN, createPresenceProjector, BROADCAST_THROTTLE_MS, createSyncGate, clearLocalAwareness, validateRoomId, createDepartureChannel, resolveTransportForServerUrl, isMixedContentBlocked, CONNECTION_TIMEOUT_MS, registerCollaborationTeardown, sanitizeColor, cloneTemplateElementsBySlideId, cloneSlide, createWheelStepBuffer, createViewerZoomStore, clampZoomScale, mapEditingWheel, 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, buildMorphAnimationRules, findInSlides, applyFindReplacements, createCollaborationLivePatcher, publishLiveInlineText, PptxHandler, collectMediaElements, collectImagePaths, collectTableCellImagePaths, applyTableCellImagePatches, collectTableStyleImagePaths, applyTableStyleImagePatches, partitionTemplateElements, resolveAuthoredCustomShowId, buildInitialGuides, EncryptedFileError, resolveAutosaveIntervalMs, shouldWriteAutosaveSnapshot, saveAutosaveSnapshot, autosaveSnapshotMark, updateMasterViewElement, isTemplateElementId, hasShapeProperties, hasTextProperties, getInlineEditorSelection, applyStyleToSelectedSegments, setPendingSelectionRestore, applyCaseTransformToSegments, transformTextCase, masterViewElements, replaceMasterViewElements, addSection, renameSection, deleteSection, moveSectionUp, moveSectionDown, moveSlidesToSection, normalizeColorsForCapture, preprocessCssForCapture, slideProgressPercent, slideStatusLabel, EXPORT_ASSEMBLING_PERCENT, EXPORT_DONE_PERCENT, isExportAbortError, recordProgressPercent, downloadBlob, resolveImageResolutionScale, applyThemeToData, THEME_PRESETS, themeColorSchemesEqual, comparePresentation, applyAcceptSlide, applyAcceptAllSlides, collectUsedFonts, describeFontEmbedding, isMobileViewport, mayLeaveSlideShow, stopAllPersistentAudio, remapTextToSegments, guidePxToEmu, buildSaveSlides, embeddedFontSaveOptions, resolveSlideSizeSelection, saveDeckWithPassword, shouldProbeAutosaveRecovery, probeAutosaveRecovery, acceptAutosaveRecovery, discardAutosaveRecovery, shouldLoopContinuously, applyRehearsalTimings, copyFormatFromElement, applyFormatToElement, collectReferencedFontFamilies, resolveGoogleWebfontHref, mapEditorKey, isEditorTextInputTarget, createViewerOptionsStore, readSlidesFromYDoc, shouldRoomSlidesReplaceLoad, reconcileSlidesInYDoc, LOCAL_SYNC_ORIGIN, observeYDocSlides, shouldAutoFollowBroadcaster, detectTouchDevice, detectOrientation, deriveViewportBreakpoints, createTouchGestureRecognizer, MAX_ZOOM_SCALE, MIN_ZOOM_SCALE, isKeyboardOpen, scopeLayoutOptionsToSlide, openPptxFile, readBackstageRecentFile, isActionHidden, resolveInlineEditAutoFitHeight, canInteractWithElement, filterInteractableIds, beginShapeAdjustment, buildElementClipboardPayload, savedPresentationFileName, exportDeckJson, groupElements, generateElementId, makeCloneId, ungroupElements, alignElements, distributeElements, bringForward, sendBackward, bringToFront, sendToBack, newTableElement, createDefaultChartElement, readViewportMetrics, computeKeyboardInset, mergeShapes, mapPresentationKey, lastShowSlideIndex, firstShowSlideIndex, mapPresentationWheel, openPendingPrintWindow, computeColorFilter, filterHiddenSlideIndices, computeSlideIndices, buildPrintDocument, finishPrintWindow, buildPrintHtmlDocument, buildOutlineHtml, buildSlidesHtml, buildNotesHtml, buildHandoutsHtml, createBlankSlide, makeSlideId, buildSlideTemplateSlide, templateSchemeFromTheme, buildThemeColorMap, reResolveSlideColors, computeEntranceAnimationDelay, createPresentationSessionId, resolveTransitionDurationMs, runPresentationAction, createPresenterTimer, createInitialPresentationSnapshot, mergePresentationSnapshot, resetPresenterTimer, presenterElapsed, stepPresenterZoom, togglePresenterTimer, addCommentToList, removeCommentFromList, editCommentInList, toggleCommentResolvedInList, replyToCommentInList, canvasToJpegData, downloadDataUrl, pickSupportedMimeType, WEBM_MIME_CANDIDATES, fpsToFrameIntervalMs, segmentFrameCount, encodeGif, computeGridSpacingPx, resolveShowSlideIndexes, groupSlidesBySection, masterViewPseudoSlide, resolveHistoryDepth, hasCopyableFormat, createBackstagePresentation, buildFieldSubstitutionContext, cloneElementForPaste, computeScrollDelta, getPresetShapeClipPath, svgPathToPolygons, polygonsToSvgPath, rerouteConnectorsForMovedElements, applyReroutedConnectors, SvgExporter, deleteTableColumn, rebuildTableStructureInRawXml, insertTableColumn, deleteTableRow, insertTableRow, updateCellTextStyleInRawXml, setCellText, updateCellTextInRawXml, splitCell, updateMergeAttrsInRawXml, mergeCells, isPpactionUrl, parsePpactionUrl, resolvePresentationAction, ACTION_BUTTON_PRESETS, elementActionToPptxAction, isUrlSafe, buildSmartArtPresetData, classifyMediaType, computeSnapToShape, publishLiveGeometry, getDraggedShapeAdjustments, computeMarqueeHitIds, mergeAdditiveSelection, shouldConfirmExternalHyperlink, safeOpenUrl, applyResize, snapBoxToGrid, applyMotionPathPreset } from './chunk-G7UBIKAG.mjs';
-import { translationsEn } from './chunk-RHSA5BW5.mjs';
+import { cloneHistorySnapshot, MIN_ELEMENT_SIZE, ZOOM_TO_SELECTION_PADDING, DEFAULT_CANVAS_HEIGHT, DEFAULT_CANVAS_WIDTH, UNGROUPED_SECTION_ID, DEFAULT_SECTION_GROUP_ID, DEFAULT_TABLE_ROWS, DEFAULT_TABLE_COLUMNS, buildPdfFromImageData, buildNotesPdf, GRID_SIZE, DEFAULT_TEXT_FONT_SIZE } from './chunk-SFMATKNJ.mjs';
+import { DEFAULT_VIEWER_OPTIONS, TOOLBAR_TABS, computeVirtualRange, DEFAULT_VIRTUAL_OVERSCAN, createPresenceProjector, BROADCAST_THROTTLE_MS, createSyncGate, clearLocalAwareness, validateRoomId, createDepartureChannel, resolveTransportForServerUrl, isMixedContentBlocked, CONNECTION_TIMEOUT_MS, registerCollaborationTeardown, sanitizeColor, cloneTemplateElementsBySlideId, cloneSlide, createWheelStepBuffer, createViewerZoomStore, clampZoomScale, mapEditingWheel, cancelBuildReveal, PresentationAnimationController, scheduleAutoAdvanceChain, playGroup, 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, firstShowSlideIndex, attachPresentationVisibilityPause, presentationEntrySlideIndex, buildMorphTransitionPlan, morphOptionToMode, buildMorphAnimationRules, findInSlides, applyFindReplacements, createCollaborationLivePatcher, publishLiveInlineText, PptxHandler, collectMediaElements, collectImagePaths, applyImagePathPatches, resolveTableCellImageUrls, resolveTableStyleImageUrls, partitionTemplateElements, seedRecentColors, resolveAuthoredCustomShowId, buildInitialGuides, readOnlyRecommendation, compatibilityWarningToasts, EncryptedFileError, resolveAutosaveIntervalMs, shouldWriteAutosaveSnapshot, saveAutosaveSnapshot, autosaveSnapshotMark, updateMasterViewElement, isTemplateElementId, updateElement, hasShapeProperties, hasTextProperties, getInlineEditorSelection, applyStyleToSelectedSegments, setPendingSelectionRestore, applyCaseTransformToSegments, transformTextCase, masterViewElements, replaceMasterViewElements, addSection, renameSection, deleteSection, moveSectionUp, moveSectionDown, moveSlidesToSection, normalizeColorsForCapture, preprocessCssForCapture, slideProgressPercent, slideStatusLabel, EXPORT_ASSEMBLING_PERCENT, EXPORT_DONE_PERCENT, isExportAbortError, recordProgressPercent, downloadBlob, resolveImageResolutionScale, applyThemeToData, THEME_PRESETS, themeColorSchemesEqual, comparePresentation, applyAcceptSlide, applyAcceptAllSlides, collectUsedFonts, describeFontEmbedding, isMobileViewport, resolveAuthoredSlideRange, mayLeaveSlideShow, stopAllPersistentAudio, remapTextToSegments, guidePxToEmu, buildSaveSlides, embeddedFontSaveOptions, resolveSlideSizeSelection, saveDeckWithPassword, shouldProbeAutosaveRecovery, probeAutosaveRecovery, acceptAutosaveRecovery, discardAutosaveRecovery, shouldLoopContinuously, applyRehearsalTimings, copyFormatFromElement, applyFormatToElement, collectReferencedFontFamilies, resolveGoogleWebfontHref, mapSlideShowStartKey, mapEditorKey, isEditorTextInputTarget, createViewerOptionsStore, readSlidesFromYDoc, shouldRoomSlidesReplaceLoad, reconcileSlidesInYDoc, LOCAL_SYNC_ORIGIN, observeYDocSlides, shouldAutoFollowBroadcaster, detectTouchDevice, detectOrientation, deriveViewportBreakpoints, createTouchGestureRecognizer, MAX_ZOOM_SCALE, MIN_ZOOM_SCALE, isKeyboardOpen, scopeLayoutOptionsToSlide, viewerPreferencesFromViewProperties, DEFAULT_VIEWER_PREFERENCES, viewPropertiesPatchFromPreferences, openPptxFile, readBackstageRecentFile, isActionHidden, resolveInlineEditAutoFitHeight, canInteractWithElement, filterInteractableIds, beginShapeAdjustment, buildElementClipboardPayload, savedPresentationFileName, exportDeckJson, groupElements, generateElementId, makeCloneId, ungroupElements, alignElements, distributeElements, bringForward, sendBackward, bringToFront, sendToBack, newTableElement, createDefaultChartElement, readViewportMetrics, computeKeyboardInset, mergeShapes, mapPresentationKey, lastShowSlideIndex, mapPresentationWheel, openPendingPrintWindow, computeColorFilter, filterHiddenSlideIndices, computeSlideIndices, buildPrintDocument, finishPrintWindow, buildPrintHtmlDocument, buildOutlineHtml, buildSlidesHtml, buildNotesHtml, buildHandoutsHtml, createBlankSlide, makeSlideId, buildSlideTemplateSlide, templateSchemeFromTheme, buildThemeColorMap, reResolveSlideColors, computeEntranceAnimationDelay, createPresentationSessionId, resolveTransitionDurationMs, runPresentationAction, safeOpenUrl, toggleStageElementMedia, resolveOleVerbTarget, openUrlInNewTab, createPresenterTimer, createInitialPresentationSnapshot, mergePresentationSnapshot, resetPresenterTimer, presenterElapsed, stepPresenterZoom, togglePresenterTimer, addCommentToList, removeCommentFromList, editCommentInList, toggleCommentResolvedInList, canvasToJpegData, downloadDataUrl, pickSupportedMimeType, WEBM_MIME_CANDIDATES, fpsToFrameIntervalMs, segmentFrameCount, encodeGif, computeGridSpacingPx, resolveShowSlideIndexes, groupSlidesBySection, masterViewPseudoSlide, resolveHistoryDepth, hasCopyableFormat, createBackstagePresentation, buildFieldSubstitutionContext, cloneElementForPaste, computeScrollDelta, getPresetShapeClipPath, svgPathToPolygons, polygonsToSvgPath, rerouteConnectorsForMovedElements, applyReroutedConnectors, SvgExporter, replyToCommentInList, deleteTableColumn, rebuildTableStructureInRawXml, insertTableColumn, deleteTableRow, insertTableRow, updateCellTextStyleInRawXml, setCellText, updateCellTextInRawXml, splitCell, updateMergeAttrsInRawXml, mergeCells, isPpactionUrl, parsePpactionUrl, resolvePresentationAction, ACTION_BUTTON_PRESETS, elementActionToPptxAction, isUrlSafe, buildSmartArtPresetData, classifyMediaType, computeSnapToShape, publishLiveGeometry, getDraggedShapeAdjustments, computeMarqueeHitIds, mergeAdditiveSelection, shouldConfirmExternalHyperlink, applyResize, lockResizeAspect, snapBoxToGrid, applyMotionPathPreset } from './chunk-B7WAGQW4.mjs';
+import { translationsEn } from './chunk-XWUMM2TX.mjs';
 import { createContext, useRef, useState, useEffect, useCallback, useMemo, useLayoutEffect, useContext, useImperativeHandle, useSyncExternalStore } from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -969,67 +969,6 @@ function stopAnimationSound() {
 }
 
 // src/viewer/hooks/presentation-mode/animation-helpers.ts
-function applyAnimationGroupSteps(group, onPlayActionSound, setPresentationElementStates, presentationTimersRef) {
-  for (const step of group.steps) {
-    if (step.command) {
-      const command = step.command;
-      const timer = window.setTimeout(
-        () => {
-          executeMediaCommand(command);
-        },
-        Math.max(0, step.delayMs)
-      );
-      presentationTimersRef.current.push(timer);
-      continue;
-    }
-    if (step.stopSound) {
-      stopAnimationSound();
-    } else if (step.soundPath && onPlayActionSound) {
-      onPlayActionSound(step.soundPath);
-    }
-  }
-  setPresentationElementStates((previousStates) => {
-    const nextStates = new Map(previousStates);
-    for (const step of group.steps) {
-      if (step.command) {
-        continue;
-      }
-      const currentState = nextStates.get(step.elementId) ?? {
-        visible: true};
-      const shouldBeVisible = step.presetClass === "exit" ? currentState.visible : true;
-      const colorTargets = step.colorTargets;
-      nextStates.set(step.elementId, {
-        visible: shouldBeVisible,
-        cssAnimation: step.cssAnimation,
-        animatesFill: colorTargets?.includes("fill") ? true : void 0,
-        animatesStroke: colorTargets?.includes("stroke") ? true : void 0
-      });
-    }
-    return nextStates;
-  });
-  for (const step of group.steps) {
-    if (step.command) {
-      continue;
-    }
-    const timer = window.setTimeout(
-      () => {
-        setPresentationElementStates((previousStates) => {
-          const nextStates = new Map(previousStates);
-          const currentState = nextStates.get(step.elementId) ?? {
-            visible: true};
-          const visibleAfterStep = step.presetClass === "exit" || step.hideAfterEffect ? false : currentState.visible;
-          nextStates.set(step.elementId, {
-            visible: visibleAfterStep,
-            cssAnimation: step.holdEndState ? step.cssAnimation : void 0
-          });
-          return nextStates;
-        });
-      },
-      Math.max(0, step.delayMs + step.durationMs + 8)
-    );
-    presentationTimersRef.current.push(timer);
-  }
-}
 function shouldSeekAnimationGroup(group, endAtMs, nowMs) {
   return group?.seqNextAction === "seek" && nowMs < endAtMs;
 }
@@ -1102,49 +1041,8 @@ function finishAnimationGroupSteps(group, setPresentationElementStates, complete
   });
 }
 
-// src/viewer/hooks/presentation-mode/build-playback.ts
-function cancelBuildReveal(handle) {
-  if (handle.current !== null) {
-    cancelAnimationFrame(handle.current);
-    handle.current = null;
-  }
-}
-function driveBuildReveal(controller, buildIds, setStates, handle) {
-  cancelBuildReveal(handle);
-  if (buildIds.length === 0 || typeof requestAnimationFrame !== "function") {
-    return;
-  }
-  const start = performance.now();
-  const tick = () => {
-    const elapsedMs = performance.now() - start;
-    const states = controller.computeStatesFor(buildIds, { elapsedMs });
-    setStates((prev) => {
-      const next = new Map(prev);
-      for (const id of buildIds) {
-        const build = states.get(id)?.build;
-        if (!build) {
-          continue;
-        }
-        const existing = next.get(id) ?? { visible: true, cssAnimation: void 0 };
-        next.set(id, { ...existing, build });
-      }
-      return next;
-    });
-    let pending = false;
-    for (const id of buildIds) {
-      const build = states.get(id)?.build;
-      if (build && build.progress < 1) {
-        pending = true;
-        break;
-      }
-    }
-    handle.current = pending ? requestAnimationFrame(tick) : null;
-  };
-  tick();
-}
-
 // src/viewer/hooks/presentation-mode/entrance-animation-timers.ts
-function scheduleOpeningAutoPlayGroup(controller, deps) {
+function scheduleOpeningAutoPlayGroup(controller, ctx) {
   if (!controller.hasMoreSteps()) {
     return;
   }
@@ -1157,17 +1055,10 @@ function scheduleOpeningAutoPlayGroup(controller, deps) {
     if (!group) {
       return;
     }
-    applyAnimationGroupSteps(
-      group,
-      deps.onPlayActionSound,
-      deps.setPresentationElementStates,
-      deps.presentationTimersRef
-    );
-    deps.markAnimationGroupActive(group);
-    deps.startBuildReveal(controller, group);
-    deps.scheduleAutoAdvanceChain(controller);
+    playGroup(controller, group, ctx);
+    scheduleAutoAdvanceChain(controller, ctx);
   }, firstGroup.autoAdvanceDelayMs ?? 0);
-  deps.presentationTimersRef.current.push(timer);
+  ctx.timers.push(timer);
 }
 function scheduleEntranceAnimationTimers(slide, setPresentationAnimations, presentationTimersRef) {
   const entranceAnimations = [...slide.animations || []].filter((animation) => Boolean(animation.entrance)).sort(
@@ -1214,17 +1105,16 @@ function useAnimationPlayback(input) {
   const activeAnimationEndAtRef = useRef(0);
   const seededCompletedRef = useRef(false);
   const lastSeedCompletedRef = useRef(false);
-  const startBuildReveal = useCallback(
-    (controller, group) => {
-      driveBuildReveal(
-        controller,
-        PresentationAnimationController.collectBuildStepIds(group),
-        setPresentationElementStates,
-        buildRafRef
-      );
-    },
-    []
-  );
+  const buildPlaybackContext = useCallback(() => {
+    return {
+      setStates: setPresentationElementStates,
+      timers: presentationTimersRef.current,
+      buildHandle: buildRafRef,
+      onPlayActionSound,
+      playSound: playAnimationSound,
+      stopSound: stopAnimationSound
+    };
+  }, [onPlayActionSound]);
   useEffect(() => {
     return () => {
       cancelBuildReveal(buildRafRef);
@@ -1243,45 +1133,6 @@ function useAnimationPlayback(input) {
     activeAnimationGroupRef.current = group;
     activeAnimationEndAtRef.current = performance.now() + Math.max(0, group.totalDurationMs);
   }, []);
-  const scheduleAutoAdvanceChain = useCallback(
-    (controller) => {
-      if (!controller.shouldAutoAdvance()) {
-        return;
-      }
-      const delay = controller.getAutoAdvanceDelay();
-      const previousGroup = controller.peekNext();
-      if (!previousGroup) {
-        return;
-      }
-      const totalDelay = delay + (previousGroup.autoAdvanceDelayMs ?? 0);
-      const timer = window.setTimeout(
-        () => {
-          const group = controller.advance();
-          if (!group) {
-            return;
-          }
-          applyAnimationGroupSteps(
-            group,
-            onPlayActionSound,
-            setPresentationElementStates,
-            presentationTimersRef
-          );
-          markAnimationGroupActive(group);
-          startBuildReveal(controller, group);
-          scheduleAutoAdvanceChain(controller);
-        },
-        Math.max(0, totalDelay)
-      );
-      presentationTimersRef.current.push(timer);
-    },
-    // `scheduleAutoAdvanceChain` recursively calls itself (line 190) to walk the
-    // auto-advance chain; it can't list itself as its own dependency (the const
-    // isn't assigned yet when the array is evaluated). The recursive call still
-    // resolves correctly because the setTimeout callback only reads the binding
-    // once the outer const has been assigned.
-    // oxlint-disable-next-line react/memo-dependencies -- see comment above
-    [markAnimationGroupActive, onPlayActionSound, startBuildReveal]
-  );
   const resetSlideTimeline = useCallback(
     (slideIndex) => {
       cancelBuildReveal(buildRafRef);
@@ -1315,7 +1166,7 @@ function useAnimationPlayback(input) {
       const completedStates = controller.computeStatesFor(buildIds);
       clearPresentationTimers();
       finishAnimationGroupSteps(activeGroup, setPresentationElementStates, completedStates);
-      scheduleAutoAdvanceChain(controller);
+      scheduleAutoAdvanceChain(controller, buildPlaybackContext());
       return true;
     }
     if (!controller || !controller.hasMoreSteps()) {
@@ -1325,24 +1176,12 @@ function useAnimationPlayback(input) {
     if (!group) {
       return false;
     }
-    applyAnimationGroupSteps(
-      group,
-      onPlayActionSound,
-      setPresentationElementStates,
-      presentationTimersRef
-    );
+    const ctx = buildPlaybackContext();
+    playGroup(controller, group, ctx);
     markAnimationGroupActive(group);
-    startBuildReveal(controller, group);
-    scheduleAutoAdvanceChain(controller);
+    scheduleAutoAdvanceChain(controller, ctx);
     return true;
-  }, [
-    animationsEnabled,
-    clearPresentationTimers,
-    markAnimationGroupActive,
-    onPlayActionSound,
-    scheduleAutoAdvanceChain,
-    startBuildReveal
-  ]);
+  }, [animationsEnabled, buildPlaybackContext, clearPresentationTimers, markAnimationGroupActive]);
   const handleInteractiveShapeClick = useCallback(
     (shapeId) => {
       const controller = controllerRef.current;
@@ -1353,16 +1192,10 @@ function useAnimationPlayback(input) {
       if (!group) {
         return false;
       }
-      applyAnimationGroupSteps(
-        group,
-        onPlayActionSound,
-        setPresentationElementStates,
-        presentationTimersRef
-      );
-      startBuildReveal(controller, group);
+      playGroup(controller, group, buildPlaybackContext());
       return true;
     },
-    [onPlayActionSound, startBuildReveal]
+    [buildPlaybackContext]
   );
   const handleHoverStart = useCallback(
     (shapeId) => {
@@ -1378,16 +1211,10 @@ function useAnimationPlayback(input) {
       if (!group) {
         return false;
       }
-      applyAnimationGroupSteps(
-        group,
-        onPlayActionSound,
-        setPresentationElementStates,
-        presentationTimersRef
-      );
-      startBuildReveal(controller, group);
+      playGroup(controller, group, buildPlaybackContext());
       return true;
     },
-    [animationsEnabled, onPlayActionSound, startBuildReveal]
+    [animationsEnabled, buildPlaybackContext]
   );
   const handleHoverEnd = useCallback((shapeId) => {
     const controller = controllerRef.current;
@@ -1433,25 +1260,12 @@ function useAnimationPlayback(input) {
       }
       const controller = controllerRef.current;
       if (controller) {
-        scheduleOpeningAutoPlayGroup(controller, {
-          onPlayActionSound,
-          setPresentationElementStates,
-          presentationTimersRef,
-          startBuildReveal,
-          scheduleAutoAdvanceChain,
-          markAnimationGroupActive
-        });
+        const ctx = buildPlaybackContext();
+        scheduleOpeningAutoPlayGroup(controller, ctx);
       }
       scheduleEntranceAnimationTimers(slide, setPresentationAnimations, presentationTimersRef);
     },
-    [
-      animationsEnabled,
-      slides,
-      onPlayActionSound,
-      markAnimationGroupActive,
-      scheduleAutoAdvanceChain,
-      startBuildReveal
-    ]
+    [animationsEnabled, slides, buildPlaybackContext]
   );
   const runPresentationEntranceAnimations = useCallback(
     (slideIndex, options) => {
@@ -2019,7 +1833,7 @@ function useRehearsalTimings(input) {
 function handlePresentationActionImpl(action, deps) {
   runPresentationAction(
     action,
-    { slideCount: deps.slidesLength },
+    { slideCount: deps.slidesLength, ...deps.elementId ? { elementId: deps.elementId } : {} },
     {
       goToSlide: (slideIndex) => {
         deps.navigateToSlide(slideIndex);
@@ -2030,7 +1844,13 @@ function handlePresentationActionImpl(action, deps) {
       endShow: () => {
         deps.onSetMode("edit");
       },
-      playSound: deps.onPlayActionSound ? (soundPath) => deps.onPlayActionSound?.(soundPath) : void 0
+      playSound: deps.onPlayActionSound ? (soundPath) => deps.onPlayActionSound?.(soundPath) : void 0,
+      lastViewed: deps.onLastViewed,
+      customShow: deps.onCustomShow,
+      openFile: deps.onOpenFile,
+      openPresentation: deps.onOpenPresentation,
+      playMedia: deps.onPlayMedia,
+      oleVerb: deps.onOleVerb
     }
   );
 }
@@ -2038,7 +1858,7 @@ function handlePresentationActionImpl(action, deps) {
 // src/viewer/hooks/presentation-mode/slide-transition.ts
 function executeSlideTransition(nextSlideIndex, deps) {
   const incomingSlide = deps.slides[nextSlideIndex];
-  const transition = incomingSlide?.transition;
+  const transition = deps.reverse ? deps.slides[deps.currentSlideIndex]?.transition : incomingSlide?.transition;
   const durationMs = deps.playTransition ? resolveTransitionDurationMs(transition) : 0;
   deps.clearPresentationTimers();
   deps.setPresentationSlideIndex(nextSlideIndex);
@@ -2092,7 +1912,13 @@ function useSlideNavigation(input) {
     presentationTimersRef,
     rehearsing,
     recordCurrentSlideTime,
-    setShowRehearsalSummary
+    setShowRehearsalSummary,
+    onLastViewed,
+    onCustomShow,
+    onOpenFile,
+    onOpenPresentation,
+    onPlayMedia,
+    onOleVerb
   } = input;
   const movePresentationSlideRef = useRef(() => {
   });
@@ -2161,8 +1987,11 @@ function useSlideNavigation(input) {
         scheduleAutoAdvanceForSlide: rehearsing ? void 0 : scheduleAutoAdvanceForSlide,
         presentationTimersRef,
         setTransitionOverlay,
-        // PowerPoint plays a slide's transition only when advancing into it.
-        playTransition: direction === 1,
+        // PowerPoint plays a slide's transition only when advancing into it,
+        // and replays the LEAVING slide's transition in reverse when stepping
+        // back (a morph glides its shapes back to where they came from).
+        playTransition: true,
+        reverse: direction === -1,
         // Stepping back onto a slide shows it with its builds already played.
         seedCompleted: direction === -1
       });
@@ -2238,16 +2067,35 @@ function useSlideNavigation(input) {
     ]
   );
   const handlePresentationAction = useCallback(
-    (action) => {
+    (action, elementId) => {
       handlePresentationActionImpl(action, {
+        elementId,
         movePresentationSlide,
         navigateToSlide,
         onPlayActionSound,
         onSetMode,
-        slidesLength: slides.length
+        slidesLength: slides.length,
+        onLastViewed,
+        onCustomShow,
+        onOpenFile,
+        onOpenPresentation,
+        onPlayMedia,
+        onOleVerb
       });
     },
-    [movePresentationSlide, navigateToSlide, onPlayActionSound, onSetMode, slides.length]
+    [
+      movePresentationSlide,
+      navigateToSlide,
+      onPlayActionSound,
+      onSetMode,
+      slides.length,
+      onLastViewed,
+      onCustomShow,
+      onOpenFile,
+      onOpenPresentation,
+      onPlayMedia,
+      onOleVerb
+    ]
   );
   return {
     movePresentationSlide,
@@ -2285,6 +2133,136 @@ function useZoomNavigation(input) {
     clearZoomReturn
   };
 }
+function createCustomShowRunner(deps) {
+  let origin = null;
+  return {
+    runCustomShow(customShowId, returnAfter) {
+      const target = deps.getCustomShows().find((show) => show.id === customShowId);
+      if (!target) {
+        return;
+      }
+      origin = returnAfter ? { showId: deps.getActiveCustomShowId(), slideIndex: deps.getPresentationSlideIndex() } : null;
+      const first = firstShowSlideIndex(resolveShowSlideIndexes(deps.getSlides(), target));
+      deps.setActiveCustomShowId(customShowId);
+      if (first !== void 0) {
+        deps.navigateToSlide(first);
+      }
+    },
+    tryReturnFromCustomShow() {
+      if (!origin) {
+        return false;
+      }
+      const { showId, slideIndex } = origin;
+      origin = null;
+      deps.setActiveCustomShowId(showId);
+      deps.navigateToSlide(slideIndex);
+      return true;
+    }
+  };
+}
+function useCustomShowRunner(deps) {
+  const depsRef = useRef(deps);
+  depsRef.current = deps;
+  const runnerRef = useRef(null);
+  runnerRef.current ??= createCustomShowRunner({
+    getSlides: () => depsRef.current.getSlides(),
+    getCustomShows: () => depsRef.current.getCustomShows(),
+    getActiveCustomShowId: () => depsRef.current.getActiveCustomShowId(),
+    setActiveCustomShowId: (id) => depsRef.current.setActiveCustomShowId(id),
+    navigateToSlide: (index) => depsRef.current.navigateToSlide(index),
+    getPresentationSlideIndex: () => depsRef.current.getPresentationSlideIndex()
+  });
+  return runnerRef.current;
+}
+
+// src/viewer/hooks/presentation-mode/usePresentationActionExtensions.ts
+function usePresentationActionExtensions(input) {
+  const {
+    slides,
+    customShows,
+    activeCustomShowId,
+    onSetActiveCustomShowId,
+    presentationSlideIndex,
+    containerRef,
+    endWithBlackSlide,
+    onSetMode,
+    setEndOfShowVisible
+  } = input;
+  const navigateToSlideRef = useRef(null);
+  const navigateToSlideViaRef = useCallback((index) => {
+    navigateToSlideRef.current?.(index);
+  }, []);
+  const customShowRunner = useCustomShowRunner({
+    getSlides: () => slides,
+    getCustomShows: () => customShows,
+    getActiveCustomShowId: () => activeCustomShowId,
+    setActiveCustomShowId: (id) => onSetActiveCustomShowId?.(id),
+    navigateToSlide: navigateToSlideViaRef,
+    getPresentationSlideIndex: () => presentationSlideIndex
+  });
+  const previousSlideRef = useRef(presentationSlideIndex);
+  const lastViewedSlideRef = useRef(null);
+  useEffect(() => {
+    lastViewedSlideRef.current = previousSlideRef.current;
+    previousSlideRef.current = presentationSlideIndex;
+  }, [presentationSlideIndex]);
+  const onCustomShow = useCallback(
+    (customShowId, returnAfter) => {
+      customShowRunner.runCustomShow(customShowId, returnAfter);
+    },
+    [customShowRunner]
+  );
+  const onLastViewed = useCallback(() => {
+    const previous = lastViewedSlideRef.current;
+    if (previous !== null) {
+      navigateToSlideViaRef(previous);
+    }
+  }, [navigateToSlideViaRef]);
+  const onOpenFile = useCallback((target) => {
+    safeOpenUrl(target);
+  }, []);
+  const onOpenPresentation = useCallback((target) => {
+    safeOpenUrl(target);
+  }, []);
+  const onPlayMedia = useCallback(
+    (elementId) => {
+      toggleStageElementMedia(containerRef.current, elementId);
+    },
+    [containerRef]
+  );
+  const onOleVerb = useCallback(
+    (verb, elementId) => {
+      const target = resolveOleVerbTarget(slides[presentationSlideIndex], elementId, verb);
+      if (target) {
+        openUrlInNewTab(target.url);
+      }
+    },
+    [slides, presentationSlideIndex]
+  );
+  const handleAdvancePastLastSlide = useCallback(() => {
+    if (customShowRunner.tryReturnFromCustomShow()) {
+      return;
+    }
+    if (endWithBlackSlide) {
+      setEndOfShowVisible(true);
+    } else {
+      onSetMode("edit");
+    }
+  }, [customShowRunner, endWithBlackSlide, onSetMode, setEndOfShowVisible]);
+  const bindNavigateToSlide = useCallback((navigateToSlide) => {
+    navigateToSlideRef.current = navigateToSlide;
+  }, []);
+  return {
+    onLastViewed,
+    onCustomShow,
+    onOpenFile,
+    onOpenPresentation,
+    onPlayMedia,
+    onOleVerb,
+    handleAdvancePastLastSlide,
+    bindNavigateToSlide
+  };
+}
 function usePresenterConsole(slideIndex, active) {
   const timerRef = useRef(createPresenterTimer());
   const [snapshot, setSnapshot] = useState(() => createInitialPresentationSnapshot(slideIndex));
@@ -2341,6 +2319,7 @@ function usePresentationMode(input) {
   const {
     mode,
     slides,
+    templateElementsBySlideId,
     visibleSlideIndexes,
     activeSlideIndex,
     containerRef,
@@ -2357,7 +2336,10 @@ function usePresentationMode(input) {
     loopContinuously,
     showWithAnimation,
     useTimings,
-    endWithBlackSlide = true
+    endWithBlackSlide = true,
+    customShows = [],
+    activeCustomShowId = null,
+    onSetActiveCustomShowId
   } = input;
   const [presentationSlideIndex, setPresentationSlideIndex] = useState(0);
   const [presentationSlideVisible, setPresentationSlideVisible] = useState(true);
@@ -2412,13 +2394,17 @@ function usePresentationMode(input) {
       setPresenterMode(false);
     }
   }, [mode]);
-  const handleAdvancePastLastSlide = useCallback(() => {
-    if (endWithBlackSlide) {
-      setEndOfShowVisible(true);
-    } else {
-      onSetMode("edit");
-    }
-  }, [endWithBlackSlide, onSetMode]);
+  const actionExtensions = usePresentationActionExtensions({
+    slides,
+    customShows,
+    activeCustomShowId,
+    onSetActiveCustomShowId,
+    presentationSlideIndex,
+    containerRef,
+    endWithBlackSlide,
+    onSetMode,
+    setEndOfShowVisible
+  });
   const {
     movePresentationSlide: moveNavigationSlide,
     navigateToSlide,
@@ -2436,7 +2422,7 @@ function usePresentationMode(input) {
     onPlayActionSound,
     loopContinuously,
     useTimings,
-    onAdvancePastLastSlide: handleAdvancePastLastSlide,
+    onAdvancePastLastSlide: actionExtensions.handleAdvancePastLastSlide,
     playNextAnimationGroup,
     clearPresentationTimers,
     seedSlideAnimations,
@@ -2444,8 +2430,15 @@ function usePresentationMode(input) {
     presentationTimersRef,
     rehearsing,
     recordCurrentSlideTime,
-    setShowRehearsalSummary
+    setShowRehearsalSummary,
+    onLastViewed: actionExtensions.onLastViewed,
+    onCustomShow: actionExtensions.onCustomShow,
+    onOpenFile: actionExtensions.onOpenFile,
+    onOpenPresentation: actionExtensions.onOpenPresentation,
+    onPlayMedia: actionExtensions.onPlayMedia,
+    onOleVerb: actionExtensions.onOleVerb
   });
+  actionExtensions.bindNavigateToSlide(navigateToSlide);
   const movePresentationSlide = useCallback(
     (direction, trigger = "explicit") => {
       if (!acceptsPresentationInput()) {
@@ -2516,6 +2509,13 @@ function usePresentationMode(input) {
     }
     onSetMode("present");
   }, [containerRef, onSetMode, setRehearsing]);
+  const enterPresentModeFromBeginning = useCallback(() => {
+    const first = firstShowSlideIndex(visibleSlideIndexes);
+    if (first !== void 0) {
+      onSetActiveSlideIndex(first);
+    }
+    enterPresentMode();
+  }, [visibleSlideIndexes, onSetActiveSlideIndex, enterPresentMode]);
   const enterPresenterView = useCallback(() => {
     setPresenterMode(true);
     setRehearsing(false);
@@ -2578,6 +2578,10 @@ function usePresentationMode(input) {
   scheduleAutoAdvanceRef.current = scheduleAutoAdvanceForSlide;
   const activeSlideIndexRef = useRef(activeSlideIndex);
   activeSlideIndexRef.current = activeSlideIndex;
+  const visibleSlideIndexesRef = useRef(visibleSlideIndexes);
+  visibleSlideIndexesRef.current = visibleSlideIndexes;
+  const onSetActiveSlideIndexRef = useRef(onSetActiveSlideIndex);
+  onSetActiveSlideIndexRef.current = onSetActiveSlideIndex;
   const presentationSlideIndexRef = useRef(presentationSlideIndex);
   presentationSlideIndexRef.current = presentationSlideIndex;
   const clearPresentationTimersRef = useRef(clearPresentationTimers);
@@ -2594,8 +2598,14 @@ function usePresentationMode(input) {
   }, [mode, containerRef]);
   useLayoutEffect(() => {
     if (mode === "present") {
-      const idx = activeSlideIndexRef.current;
+      const idx = presentationEntrySlideIndex(
+        activeSlideIndexRef.current,
+        visibleSlideIndexesRef.current
+      );
       setPresentationSlideIndex(idx);
+      if (idx !== activeSlideIndexRef.current) {
+        onSetActiveSlideIndexRef.current(idx);
+      }
       runEntranceAnimationsRef.current(idx);
       scheduleAutoAdvanceRef.current(idx);
     } else {
@@ -2666,13 +2676,18 @@ function usePresentationMode(input) {
     if (!transitionOverlay || transitionOverlay.transition.type !== "morph") {
       return void 0;
     }
+    const incoming = slides[transitionOverlay.incomingSlideIndex];
     return buildMorphTransitionPlan(
       slides[transitionOverlay.outgoingSlideIndex],
-      slides[transitionOverlay.incomingSlideIndex],
+      incoming,
       transitionOverlay.durationMs,
-      morphOptionToMode(transitionOverlay.transition.morphOption)
+      morphOptionToMode(transitionOverlay.transition.morphOption),
+      // `PresentationStage` stacks the incoming slide's elements above its
+      // template shapes (`zIndex = templateElements.length + index`), so a
+      // z-index journey has to start counting where the stage does.
+      { zIndexBase: incoming ? templateElementsBySlideId?.[incoming.id]?.length ?? 0 : 0 }
     );
-  }, [transitionOverlay, slides]);
+  }, [transitionOverlay, slides, templateElementsBySlideId]);
   const morphedElementStates = useMemo(() => {
     if (!morphPlan || morphPlan.incomingAnimations.size === 0) {
       return presentationElementStates;
@@ -2721,6 +2736,7 @@ ${imageRules}`;
     handleHoverStart,
     handleHoverEnd,
     enterPresentMode,
+    enterPresentModeFromBeginning,
     presenterMode,
     enterPresenterView,
     togglePresenterView,
@@ -3112,6 +3128,38 @@ function useModalDismissDrag(onClose, threshold = 120) {
     handlers: { onPointerDown, onPointerMove, onPointerUp, onPointerCancel: onPointerUp }
   };
 }
+function withoutKey(map, key) {
+  if (!(key in map)) {
+    return map;
+  }
+  const next = { ...map };
+  delete next[key];
+  return next;
+}
+function useCommentMentionDrafts() {
+  const [commentDraftMentionsBySlideId, setCommentDraftMentionsBySlideId] = useState({});
+  const [replyDraftMentionsByCommentId, setReplyDraftMentionsByCommentId] = useState({});
+  const setCommentDraftMentions = useCallback((slideId, mentions) => {
+    setCommentDraftMentionsBySlideId((prev) => ({ ...prev, [slideId]: mentions }));
+  }, []);
+  const setReplyDraftMentions = useCallback((commentId, mentions) => {
+    setReplyDraftMentionsByCommentId((prev) => ({ ...prev, [commentId]: mentions }));
+  }, []);
+  const clearCommentDraftMentions = useCallback((slideId) => {
+    setCommentDraftMentionsBySlideId((prev) => withoutKey(prev, slideId));
+  }, []);
+  const clearReplyDraftMentions = useCallback((commentId) => {
+    setReplyDraftMentionsByCommentId((prev) => withoutKey(prev, commentId));
+  }, []);
+  return {
+    commentDraftMentionsBySlideId,
+    replyDraftMentionsByCommentId,
+    setCommentDraftMentions,
+    setReplyDraftMentions,
+    clearCommentDraftMentions,
+    clearReplyDraftMentions
+  };
+}
 
 // src/viewer/hooks/useComments-helpers.ts
 function replaceCommentsOnSlide(slides, slideIndex, next) {
@@ -3119,7 +3167,7 @@ function replaceCommentsOnSlide(slides, slideIndex, next) {
     (entry, index) => index === slideIndex ? { ...entry, comments: next } : entry
   );
 }
-function addCommentToSlide(slides, slideIndex, text, authorName, elementId) {
+function addCommentToSlide(slides, slideIndex, text, authorName, elementId, mentions) {
   const slide = slides[slideIndex];
   if (!slide) {
     return { slides, didAdd: false };
@@ -3135,7 +3183,10 @@ function addCommentToSlide(slides, slideIndex, text, authorName, elementId) {
   if (!next) {
     return { slides, didAdd: false };
   }
-  return { slides: replaceCommentsOnSlide(slides, slideIndex, next), didAdd: true };
+  const withMentions = mentions && mentions.length > 0 ? next.map(
+    (comment, index) => index === next.length - 1 ? { ...comment, mentions } : comment
+  ) : next;
+  return { slides: replaceCommentsOnSlide(slides, slideIndex, withMentions), didAdd: true };
 }
 function removeCommentFromSlide(slides, slideIndex, commentId) {
   const slide = slides[slideIndex];
@@ -3170,7 +3221,7 @@ function toggleResolvedInSlide(slides, slideIndex, commentId) {
   }
   return { slides: replaceCommentsOnSlide(slides, slideIndex, next), didUpdate: true };
 }
-function addReplyToSlide(slides, slideIndex, parentId, text, authorName) {
+function addReplyToSlide(slides, slideIndex, parentId, text, authorName, mentions) {
   const slide = slides[slideIndex];
   if (!slide) {
     return { slides, didAdd: false };
@@ -3179,7 +3230,15 @@ function addReplyToSlide(slides, slideIndex, parentId, text, authorName) {
   if (!next) {
     return { slides, didAdd: false };
   }
-  return { slides: replaceCommentsOnSlide(slides, slideIndex, next), didAdd: true };
+  const withMentions = mentions && mentions.length > 0 ? next.map(
+    (comment) => comment.id === parentId && comment.replies && comment.replies.length > 0 ? {
+      ...comment,
+      replies: comment.replies.map(
+        (reply, index) => index === comment.replies.length - 1 ? { ...reply, mentions } : reply
+      )
+    } : comment
+  ) : next;
+  return { slides: replaceCommentsOnSlide(slides, slideIndex, withMentions), didAdd: true };
 }
 function pruneSlideDrafts(drafts, slideIds) {
   const next = {};
@@ -3194,6 +3253,95 @@ function pruneSlideDrafts(drafts, slideIds) {
   return changed ? next : null;
 }
 
+// src/viewer/hooks/useCommentReplyHandlers.ts
+function useCommentReplyHandlers(input) {
+  const {
+    slides,
+    canEdit,
+    userName,
+    onUpdateSlides,
+    onMarkDirty,
+    replyDraftMentionsByCommentId,
+    setReplyDraftMentions,
+    clearReplyDraftMentions
+  } = input;
+  const [replyDraftByCommentId, setReplyDraftByCommentId] = useState({});
+  const [replyingToCommentId, setReplyingToCommentId] = useState(null);
+  const handleStartReply = useCallback((_slideIndex, commentId) => {
+    setReplyingToCommentId(commentId);
+    setReplyDraftByCommentId((prev) => ({ ...prev, [commentId]: "" }));
+  }, []);
+  const handleCancelReply = useCallback(() => {
+    setReplyingToCommentId(null);
+  }, []);
+  const handleReplyDraftChange = useCallback(
+    (commentId, draft, mentions) => {
+      setReplyDraftByCommentId((prev) => ({ ...prev, [commentId]: draft }));
+      if (mentions) {
+        setReplyDraftMentions(commentId, mentions);
+      }
+    },
+    [setReplyDraftMentions]
+  );
+  const handleSubmitReply = useCallback(
+    (slideIndex, commentId) => {
+      if (!canEdit) {
+        return;
+      }
+      const slide = slides[slideIndex];
+      if (!slide) {
+        return;
+      }
+      const replyText = String(replyDraftByCommentId[commentId] || "").trim();
+      if (replyText.length === 0) {
+        return;
+      }
+      let didAdd = false;
+      onUpdateSlides((prev) => {
+        const result = addReplyToSlide(
+          prev,
+          slideIndex,
+          commentId,
+          replyText,
+          userName,
+          replyDraftMentionsByCommentId[commentId]
+        );
+        didAdd = result.didAdd;
+        return result.slides;
+      });
+      if (!didAdd) {
+        return;
+      }
+      setReplyingToCommentId(null);
+      setReplyDraftByCommentId((prev) => {
+        const next = { ...prev };
+        delete next[commentId];
+        return next;
+      });
+      clearReplyDraftMentions(commentId);
+      onMarkDirty();
+    },
+    [
+      canEdit,
+      onMarkDirty,
+      onUpdateSlides,
+      replyDraftByCommentId,
+      replyDraftMentionsByCommentId,
+      clearReplyDraftMentions,
+      slides,
+      userName
+    ]
+  );
+  return {
+    replyingToCommentId,
+    replyDraftByCommentId,
+    handleStartReply,
+    handleCancelReply,
+    handleReplyDraftChange,
+    handleSubmitReply
+  };
+}
+
 // src/viewer/hooks/useComments.ts
 function useComments({
   slides,
@@ -3206,11 +3354,33 @@ function useComments({
   const [commentDraftBySlideId, setCommentDraftBySlideId] = useState({});
   const [editingCommentIdBySlideId, setEditingCommentIdBySlideId] = useState({});
   const [commentEditDraftByCommentId, setCommentEditDraftByCommentId] = useState({});
-  const [replyDraftByCommentId, setReplyDraftByCommentId] = useState({});
-  const [replyingToCommentId, setReplyingToCommentId] = useState(null);
-  const handleCommentDraftChange = useCallback((slideId, draft) => {
-    setCommentDraftBySlideId((prev) => ({ ...prev, [slideId]: draft }));
-  }, []);
+  const {
+    commentDraftMentionsBySlideId,
+    replyDraftMentionsByCommentId,
+    setCommentDraftMentions,
+    setReplyDraftMentions,
+    clearCommentDraftMentions,
+    clearReplyDraftMentions
+  } = useCommentMentionDrafts();
+  const reply = useCommentReplyHandlers({
+    slides,
+    canEdit,
+    userName,
+    onUpdateSlides,
+    onMarkDirty,
+    replyDraftMentionsByCommentId,
+    setReplyDraftMentions,
+    clearReplyDraftMentions
+  });
+  const handleCommentDraftChange = useCallback(
+    (slideId, draft, mentions) => {
+      setCommentDraftBySlideId((prev) => ({ ...prev, [slideId]: draft }));
+      if (mentions) {
+        setCommentDraftMentions(slideId, mentions);
+      }
+    },
+    [setCommentDraftMentions]
+  );
   const handleSetCommentEditDraft = useCallback((commentId, draft) => {
     setCommentEditDraftByCommentId((prev) => ({
       ...prev,
@@ -3237,7 +3407,8 @@ function useComments({
           slideIndex,
           draft,
           userName,
-          selectedElementId ?? void 0
+          selectedElementId ?? void 0,
+          commentDraftMentionsBySlideId[slide.id]
         );
         didAdd = result.didAdd;
         return result.slides;
@@ -3249,11 +3420,14 @@ function useComments({
         ...prev,
         [slide.id]: ""
       }));
+      clearCommentDraftMentions(slide.id);
       onMarkDirty();
     },
     [
       canEdit,
       commentDraftBySlideId,
+      commentDraftMentionsBySlideId,
+      clearCommentDraftMentions,
       onMarkDirty,
       onUpdateSlides,
       selectedElementId,
@@ -3365,48 +3539,6 @@ function useComments({
     },
     [canEdit, onMarkDirty, onUpdateSlides, slides]
   );
-  const handleStartReply = useCallback((_slideIndex, commentId) => {
-    setReplyingToCommentId(commentId);
-    setReplyDraftByCommentId((prev) => ({ ...prev, [commentId]: "" }));
-  }, []);
-  const handleCancelReply = useCallback(() => {
-    setReplyingToCommentId(null);
-  }, []);
-  const handleReplyDraftChange = useCallback((commentId, draft) => {
-    setReplyDraftByCommentId((prev) => ({ ...prev, [commentId]: draft }));
-  }, []);
-  const handleSubmitReply = useCallback(
-    (slideIndex, commentId) => {
-      if (!canEdit) {
-        return;
-      }
-      const slide = slides[slideIndex];
-      if (!slide) {
-        return;
-      }
-      const replyText = String(replyDraftByCommentId[commentId] || "").trim();
-      if (replyText.length === 0) {
-        return;
-      }
-      let didAdd = false;
-      onUpdateSlides((prev) => {
-        const result = addReplyToSlide(prev, slideIndex, commentId, replyText, userName);
-        didAdd = result.didAdd;
-        return result.slides;
-      });
-      if (!didAdd) {
-        return;
-      }
-      setReplyingToCommentId(null);
-      setReplyDraftByCommentId((prev) => {
-        const next = { ...prev };
-        delete next[commentId];
-        return next;
-      });
-      onMarkDirty();
-    },
-    [canEdit, onMarkDirty, onUpdateSlides, replyDraftByCommentId, slides, userName]
-  );
   useEffect(() => {
     const slideIds = new Set(slides.map((slide) => slide.id));
     setCommentDraftBySlideId((prev) => {
@@ -3418,8 +3550,8 @@ function useComments({
     commentDraftBySlideId,
     editingCommentIdBySlideId,
     commentEditDraftByCommentId,
-    replyingToCommentId,
-    replyDraftByCommentId,
+    commentDraftMentionsBySlideId,
+    replyDraftMentionsByCommentId,
     handleCommentDraftChange,
     handleAddSlideComment,
     handleDeleteSlideComment,
@@ -3428,10 +3560,7 @@ function useComments({
     handleSaveCommentEdit,
     handleSetCommentEditDraft,
     handleToggleCommentResolved,
-    handleStartReply,
-    handleCancelReply,
-    handleReplyDraftChange,
-    handleSubmitReply
+    ...reply
   };
 }
 function buildElementLookup(templateElements, slideElements) {
@@ -3596,6 +3725,8 @@ function useViewerCoreState(_input) {
   const [headerFooter, setHeaderFooter] = useState({});
   const [layoutOptions, setLayoutOptions] = useState([]);
   const [slideMasters, setSlideMasters] = useState([]);
+  const [modernCommentAuthors, setModernCommentAuthors] = useState([]);
+  const [recentColors, setRecentColors] = useState([]);
   const [theme, setTheme] = useState();
   const [tableStyleMap, setTableStyleMap] = useState();
   const [themeOptions, setThemeOptions] = useState([]);
@@ -3689,6 +3820,10 @@ function useViewerCoreState(_input) {
     setLayoutOptions,
     slideMasters,
     setSlideMasters,
+    modernCommentAuthors,
+    setModernCommentAuthors,
+    recentColors,
+    setRecentColors,
     theme,
     setTheme,
     tableStyleMap,
@@ -3873,6 +4008,8 @@ function useLoadContent({
   setHeaderFooter,
   setLayoutOptions,
   setSlideMasters,
+  setModernCommentAuthors,
+  setRecentColors,
   setTheme,
   setTableStyleMap,
   setThemeOptions,
@@ -3894,6 +4031,8 @@ function useLoadContent({
   setHasDigitalSignatures,
   setDigitalSignatureCount,
   setGuides,
+  setReadOnlyRecommendation,
+  setCompatToasts,
   setLoading,
   setError,
   setIsDirty,
@@ -3992,93 +4131,19 @@ function useLoadContent({
               }
             })
           );
-          const elementPatches = /* @__PURE__ */ new Map();
-          for (const ref of imageRefs) {
-            const url = resolvedMap.get(ref.path);
-            if (!url) {
-              continue;
-            }
-            const id = ref.element.id;
-            const existing = elementPatches.get(id) ?? {};
-            existing[ref.field] = url;
-            elementPatches.set(id, existing);
-          }
-          if (elementPatches.size > 0) {
-            const patchElements = (elements) => {
-              let mutated = false;
-              const next = elements.map((el) => {
-                let updated = el;
-                const patch = elementPatches.get(el.id);
-                if (patch) {
-                  updated = { ...el, ...patch };
-                }
-                if (updated.type === "group" && updated.children?.length) {
-                  const newChildren = patchElements(updated.children);
-                  if (newChildren !== updated.children) {
-                    updated = { ...updated, children: newChildren };
-                  }
-                }
-                if (updated !== el) {
-                  mutated = true;
-                }
-                return updated;
-              });
-              return mutated ? next : elements;
-            };
-            nextSlides = parsed.slides.map((s) => {
-              const newElements = patchElements(s.elements);
-              return newElements === s.elements ? s : { ...s, elements: newElements };
-            });
-          }
-        }
-        const { paths: tableImagePaths, refs: tableImageRefs } = collectTableCellImagePaths(nextSlides);
-        if (tableImagePaths.size > 0) {
-          const resolvedTableMap = /* @__PURE__ */ new Map();
-          await Promise.all(
-            Array.from(tableImagePaths).map(async (path) => {
-              try {
-                const url = await handler.getImageData(path);
-                if (url) {
-                  resolvedTableMap.set(path, url);
-                }
-              } catch {
-              }
-            })
-          );
-          if (resolvedTableMap.size > 0) {
-            nextSlides = nextSlides.map((s) => {
-              const newElements = applyTableCellImagePatches(
-                s.elements,
-                resolvedTableMap,
-                tableImageRefs
-              );
-              return newElements === s.elements ? s : { ...s, elements: newElements };
-            });
-          }
-        }
-        let nextTableStyleMap = parsed.tableStyleMap;
-        const { paths: tableStyleImagePaths, refs: tableStyleImageRefs } = collectTableStyleImagePaths(nextTableStyleMap);
-        if (tableStyleImagePaths.size > 0) {
-          const resolvedStyleMap = /* @__PURE__ */ new Map();
-          await Promise.all(
-            Array.from(tableStyleImagePaths).map(async (path) => {
-              try {
-                const url = await handler.getImageData(path);
-                if (url) {
-                  resolvedStyleMap.set(path, url);
-                }
-              } catch {
-              }
-            })
-          );
-          if (resolvedStyleMap.size > 0 && nextTableStyleMap) {
-            nextTableStyleMap = applyTableStyleImagePatches(
-              nextTableStyleMap,
-              resolvedStyleMap,
-              tableStyleImageRefs
-            );
-          }
+          nextSlides = parsed.slides.map((s) => {
+            const newElements = applyImagePathPatches(s.elements, resolvedMap, imageRefs);
+            return newElements === s.elements ? s : { ...s, elements: newElements };
+          });
         }
+        nextSlides = await resolveTableCellImageUrls(
+          nextSlides,
+          (path) => handler.getImageData(path)
+        );
+        const nextTableStyleMap = await resolveTableStyleImageUrls(
+          parsed.tableStyleMap,
+          (path) => handler.getImageData(path)
+        );
         handlerRef.current = handler;
         const partition = partitionTemplateElements(nextSlides);
         setSlides(partition.slides);
@@ -4097,6 +4162,8 @@ function useLoadContent({
         setHeaderFooter(parsed.headerFooter ?? {});
         setLayoutOptions(parsed.layoutOptions ?? []);
         setSlideMasters(parsed.slideMasters ?? []);
+        setModernCommentAuthors(parsed.modernCommentAuthors ?? []);
+        setRecentColors(seedRecentColors({ mruColors: parsed.mruColors }));
         setTheme(parsed.theme);
         setTableStyleMap(nextTableStyleMap);
         setThemeOptions(parsed.themeOptions ?? []);
@@ -4126,6 +4193,13 @@ function useLoadContent({
         setHasDigitalSignatures(parsed.hasDigitalSignatures === true);
         setDigitalSignatureCount(parsed.digitalSignatureCount ?? 0);
         setGuides(buildInitialGuides(parsed.presentationGuides, parsed.slides[0]?.guides));
+        setReadOnlyRecommendation(readOnlyRecommendation(parsed));
+        setCompatToasts(
+          compatibilityWarningToasts([
+            ...parsed.warnings ?? [],
+            ...parsed.slides.flatMap((slide) => slide.warnings ?? [])
+          ])
+        );
         setActiveSlideIndex(0);
         clearSelection();
         setIsDirty(false);
@@ -4312,19 +4386,7 @@ function useElementOperations(input) {
           }));
         }
       } else {
-        setSlides(
-          (prev) => prev.map(
-            (s, i) => i !== activeSlideIndex ? s : {
-              ...s,
-              elements: s.elements.map(
-                (el) => el.id === elementId ? {
-                  ...el,
-                  ...updates
-                } : el
-              )
-            }
-          )
-        );
+        setSlides((prev) => updateElement(prev, activeSlideIndex, elementId, updates));
       }
       history.markDirty();
     },
@@ -4554,16 +4616,49 @@ function useSectionOperations(input) {
   };
 }
 
+// src/viewer/utils/selection-handle-overlay.ts
+var VIEWPORT_SELECTOR = "[data-pptx-viewport]";
+function findSelectionHandleHost(elementNode, elementId) {
+  const scope = elementNode.closest(VIEWPORT_SELECTOR) ?? elementNode.parentElement;
+  if (!scope) {
+    return null;
+  }
+  for (const candidate of scope.querySelectorAll("[data-pptx-handle-for]")) {
+    if (candidate.getAttribute("data-pptx-handle-for") === elementId) {
+      return candidate;
+    }
+  }
+  return null;
+}
+function syncSelectionHandleOverlay(elementNode, elementId, geometry) {
+  const host = findSelectionHandleHost(elementNode, elementId);
+  if (!host) {
+    return;
+  }
+  if (geometry.x !== void 0) {
+    host.style.left = `${geometry.x}px`;
+  }
+  if (geometry.y !== void 0) {
+    host.style.top = `${geometry.y}px`;
+  }
+  if (geometry.width !== void 0) {
+    host.style.width = `${geometry.width}px`;
+  }
+  if (geometry.height !== void 0) {
+    host.style.height = `${geometry.height}px`;
+  }
+  if (geometry.transform !== void 0) {
+    host.style.transform = geometry.transform;
+  }
+}
+
 // src/viewer/hooks/pointer-move-handlers.ts
-function computeResizeGeometry(handle, startX, startY, startWidth, startHeight, dx, dy, snapToGrid, gridSpacingPx) {
-  const resized = applyResize(
-    { x: startX, y: startY, width: startWidth, height: startHeight },
-    handle,
-    dx,
-    dy,
-    1,
-    { minSize: MIN_ELEMENT_SIZE }
-  );
+function computeResizeGeometry(handle, startX, startY, startWidth, startHeight, dx, dy, snapToGrid, gridSpacingPx, lockAspect = false) {
+  const startBox = { x: startX, y: startY, width: startWidth, height: startHeight };
+  let resized = applyResize(startBox, handle, dx, dy, 1, { minSize: MIN_ELEMENT_SIZE });
+  if (lockAspect) {
+    resized = lockResizeAspect(resized, startBox, handle, MIN_ELEMENT_SIZE);
+  }
   const box = { x: resized.x, y: resized.y, width: resized.width, height: resized.height };
   if (!snapToGrid) {
     return box;
@@ -4713,8 +4808,11 @@ function processDragMove(e, drag, editorScale, snapToGrid, snapToShape, gridSpac
   for (const [id, domEl] of drag.domEls) {
     const start = drag.startPositionsById[id];
     if (start) {
-      domEl.style.left = `${start.x + appliedDx}px`;
-      domEl.style.top = `${start.y + appliedDy}px`;
+      const x = start.x + appliedDx;
+      const y = start.y + appliedDy;
+      domEl.style.left = `${x}px`;
+      domEl.style.top = `${y}px`;
+      syncSelectionHandleOverlay(domEl, id, { x, y });
     }
   }
   if (live) {
@@ -4745,24 +4843,28 @@ function processResizeMove(e, rs, editorScale, snapToGrid, gridSpacingPx, live)
     dx,
     dy,
     snapToGrid,
-    gridSpacingPx
+    gridSpacingPx,
+    e.shiftKey
   );
   rs.lastX = geo.x;
   rs.lastY = geo.y;
   rs.lastWidth = geo.width;
   rs.lastHeight = geo.height;
+  const width = Math.max(geo.width, MIN_ELEMENT_SIZE);
+  const height = Math.max(geo.height, MIN_ELEMENT_SIZE);
   if (rs.domEl) {
     rs.domEl.style.left = `${geo.x}px`;
     rs.domEl.style.top = `${geo.y}px`;
-    rs.domEl.style.width = `${Math.max(geo.width, MIN_ELEMENT_SIZE)}px`;
-    rs.domEl.style.height = `${Math.max(geo.height, MIN_ELEMENT_SIZE)}px`;
+    rs.domEl.style.width = `${width}px`;
+    rs.domEl.style.height = `${height}px`;
+    syncSelectionHandleOverlay(rs.domEl, rs.elementId, { x: geo.x, y: geo.y, width, height });
   }
   if (live) {
     publishLiveGeometry(live.patcher, live.slideId, rs.elementId, {
       x: geo.x,
       y: geo.y,
-      width: Math.max(geo.width, MIN_ELEMENT_SIZE),
-      height: Math.max(geo.height, MIN_ELEMENT_SIZE)
+      width,
+      height
     });
   }
 }
@@ -7721,7 +7823,7 @@ function usePrintHandlers(input) {
           printWindow,
           buildPrintHtmlDocument({
             title: `Handout ${spp} per page`,
-            bodyHtml: buildHandoutsHtml(slideImages, slideIndices, spp),
+            bodyHtml: buildHandoutsHtml(slideImages, slideIndices, spp, pptxData?.handoutMaster),
             orientation: "portrait",
             colorFilter,
             frameSlides: settings.frameSlides,
@@ -8378,9 +8480,10 @@ function useViewerDialogs(input) {
 function computeGridSpacingPx2(documentGridSpacing) {
   return computeGridSpacingPx(documentGridSpacing, GRID_SIZE);
 }
-function computeVisibleSlideIndexes(slides, activeCustomShowId, customShows) {
+function computeVisibleSlideIndexes(slides, activeCustomShowId, customShows, presentationProperties) {
   const activeShow = activeCustomShowId ? customShows.find((show) => show.id === activeCustomShowId) : void 0;
-  return resolveShowSlideIndexes(slides, activeShow);
+  const authoredRange = resolveAuthoredSlideRange(presentationProperties, slides.length);
+  return resolveShowSlideIndexes(slides, activeShow, authoredRange);
 }
 function computeSlideSectionGroups(slides, sections) {
   return groupSlidesBySection(sections, slides).map((group) => ({
@@ -8409,6 +8512,7 @@ function useDerivedSlideState(input) {
     sections,
     customShows,
     activeCustomShowId,
+    presentationProperties,
     mode,
     activeLayout,
     activeMaster,
@@ -8419,8 +8523,12 @@ function useDerivedSlideState(input) {
     [documentGridSpacing]
   );
   const visibleSlideIndexes = useMemo(
-    () => computeVisibleSlideIndexes(slides, activeCustomShowId, customShows),
-    [slides, activeCustomShowId, customShows]
+    () => computeVisibleSlideIndexes(slides, activeCustomShowId, customShows, presentationProperties),
+    [slides, activeCustomShowId, customShows, presentationProperties]
+  );
+  const authoredRange = useMemo(
+    () => resolveAuthoredSlideRange(presentationProperties, slides.length),
+    [presentationProperties, slides.length]
   );
   const slideSectionGroups = useMemo(
     () => computeSlideSectionGroups(slides, sections).map((group) => {
@@ -8442,7 +8550,8 @@ function useDerivedSlideState(input) {
     gridSpacingPx,
     visibleSlideIndexes,
     slideSectionGroups,
-    masterPseudoSlide
+    masterPseudoSlide,
+    authoredRange
   };
 }
 function useAnnotationHandlers(input) {
@@ -8580,6 +8689,7 @@ function useSerialize(input) {
     guides,
     headerFooter,
     presentationProperties,
+    viewProperties,
     customShows,
     sections,
     coreProperties,
@@ -8641,6 +8751,7 @@ function useSerialize(input) {
       slideSize: resolveSlideSizeSelection({ current: slideSizeEmu, canvas: canvasSize }).size,
       headerFooter,
       presentationProperties,
+      viewProperties,
       customShows: customShows.length > 0 ? customShows : void 0,
       sections: sections.length > 0 ? sections : void 0,
       coreProperties,
@@ -8660,6 +8771,7 @@ function useSerialize(input) {
     slideSizeEmu,
     headerFooter,
     presentationProperties,
+    viewProperties,
     customShows,
     sections,
     coreProperties,
@@ -8730,6 +8842,7 @@ function usePresentationSetup(input) {
   const {
     mode,
     slides,
+    templateElementsBySlideId,
     visibleSlideIndexes,
     activeSlideIndex,
     containerRef,
@@ -8743,7 +8856,10 @@ function usePresentationSetup(input) {
     endWithBlackSlide = true,
     promptKeepInkAnnotations = true,
     popupToolbarEnabled = true,
-    onToggleSubtitles
+    onToggleSubtitles,
+    customShows = [],
+    activeCustomShowId = null,
+    onSetActiveCustomShowId
   } = input;
   const actionSoundHandlerRef = useRef(null);
   const exitModeHandlerRef = useRef(null);
@@ -8755,6 +8871,7 @@ function usePresentationSetup(input) {
   const presentation = usePresentationMode({
     mode,
     slides,
+    templateElementsBySlideId,
     visibleSlideIndexes,
     activeSlideIndex,
     containerRef,
@@ -8832,7 +8949,10 @@ function usePresentationSetup(input) {
     loopContinuously: shouldLoopContinuously(presentationProperties),
     showWithAnimation: presentationProperties.showWithAnimation,
     useTimings: presentationProperties.advanceMode !== "manual",
-    endWithBlackSlide
+    endWithBlackSlide,
+    customShows,
+    activeCustomShowId,
+    onSetActiveCustomShowId
   });
   return {
     presentation,
@@ -9316,7 +9436,9 @@ function useContentLifecycle(input) {
     setIsEncryptedDialogOpen,
     password,
     onContentApplied,
-    allowExternalImages
+    allowExternalImages,
+    setReadOnlyRecommendation,
+    setCompatToasts
   } = input;
   const { handlerRef } = useLoadContent({
     content,
@@ -9330,6 +9452,8 @@ function useContentLifecycle(input) {
     setHeaderFooter: state.setHeaderFooter,
     setLayoutOptions: state.setLayoutOptions,
     setSlideMasters: state.setSlideMasters,
+    setModernCommentAuthors: state.setModernCommentAuthors,
+    setRecentColors: state.setRecentColors,
     setTheme: state.setTheme,
     setTableStyleMap: state.setTableStyleMap,
     setThemeOptions: state.setThemeOptions,
@@ -9351,6 +9475,8 @@ function useContentLifecycle(input) {
     setHasDigitalSignatures: state.setHasDigitalSignatures,
     setDigitalSignatureCount: state.setDigitalSignatureCount,
     setGuides: state.setGuides,
+    setReadOnlyRecommendation,
+    setCompatToasts,
     setLoading: state.setLoading,
     setError: state.setError,
     setIsDirty: state.setIsDirty,
@@ -9371,6 +9497,7 @@ function useContentLifecycle(input) {
     guides: state.guides,
     headerFooter: state.headerFooter,
     presentationProperties: state.presentationProperties,
+    viewProperties: state.viewProperties,
     customShows: state.customShows,
     sections: state.sections,
     coreProperties: state.coreProperties,
@@ -9426,6 +9553,16 @@ function useKeyboardShortcuts(input) {
   inputRef.current = input;
   const handleKeyDown = useCallback((e) => {
     const current = inputRef.current;
+    const startAction = mapSlideShowStartKey(e, { isPresenting: current.mode === "present" });
+    if (startAction !== null) {
+      e.preventDefault();
+      if (startAction === "fromBeginning") {
+        current.onStartShowFromBeginning();
+      } else {
+        current.onStartShowFromCurrent();
+      }
+      return;
+    }
     const { action, dx, dy } = mapEditorKey(e, {
       canEdit: current.canEdit,
       // The Slide Master view is an editing surface, not a viewing one.
@@ -9506,7 +9643,18 @@ function useKeyboardShortcuts(input) {
 
 // src/viewer/hooks/useKeyboardShortcutWiring.ts
 function useKeyboardShortcutWiring(input) {
-  const { state, mode, canEdit, slides, activeSlide, ops, manipulation, history } = input;
+  const {
+    state,
+    mode,
+    canEdit,
+    slides,
+    activeSlide,
+    ops,
+    manipulation,
+    history,
+    onEnterPresentModeFromBeginning,
+    onSetMode
+  } = input;
   useKeyboardShortcuts({
     containerRef: state.containerRef,
     mode,
@@ -9576,7 +9724,9 @@ function useKeyboardShortcutWiring(input) {
         return;
       }
       state.setActiveSlideIndex((prev) => Math.min(slides.length - 1, prev + 1));
-    }
+    },
+    onStartShowFromBeginning: onEnterPresentModeFromBeginning,
+    onStartShowFromCurrent: () => onSetMode("present")
   });
 }
 function useViewerIntegration(input) {
@@ -9596,6 +9746,8 @@ function useViewerIntegration(input) {
     autosaveAllowed = true,
     autosaveIntervalMs,
     allowExternalImages,
+    setReadOnlyRecommendation,
+    setCompatToasts,
     canEdit,
     promptKeepInkAnnotations,
     imageExportScale,
@@ -9664,7 +9816,9 @@ function useViewerIntegration(input) {
       setIsEncryptedDialogOpen,
       password: dialogs.presentationPassword ?? void 0,
       onContentApplied: () => setLoadVersion((v) => v + 1),
-      allowExternalImages
+      allowExternalImages,
+      setReadOnlyRecommendation,
+      setCompatToasts
     }
   );
   const { exportHandlers, printHandlers, themeHandlers, propertyHandlers } = useIOHandlers({
@@ -9899,7 +10053,9 @@ function useViewerIntegration(input) {
     activeSlide,
     ops: editorOps.ops,
     manipulation: editorOps.manipulation,
-    history
+    history,
+    onEnterPresentModeFromBeginning: presentation.enterPresentModeFromBeginning,
+    onSetMode: handleSetMode
   });
   return {
     exportHandlers,
@@ -10579,14 +10735,14 @@ function buildCanvasProps(input) {
     }
     safeOpenUrl(url);
   };
-  const handleActionClick = (_elementId, action) => {
+  const handleActionClick = (elementId, action) => {
     if (mode === "present") {
       const resolved = resolvePresentationAction(action, { slideCount: slides.length });
       if (resolved.intent.kind === "openUrl") {
         openExternalUrl(resolved.intent.url);
         return;
       }
-      presentation.handlePresentationAction(action);
+      presentation.handlePresentationAction(action, elementId);
     } else if (action.url) {
       openExternalUrl(action.url);
     }
@@ -10795,7 +10951,8 @@ function buildToolbarProps(input) {
     onOpenFile,
     onOpenRecentFile,
     fileName,
-    hiddenActions
+    hiddenActions,
+    viewPreferencesSync
   } = input;
   const {
     handleAddAnimation,
@@ -10879,9 +11036,9 @@ function buildToolbarProps(input) {
     onSetSpellCheckEnabled: s.setSpellCheckEnabled,
     onSetShowGrid: s.setShowGrid,
     onSetShowRulers: s.setShowRulers,
-    onSetShowGuides: s.setShowGuides,
-    onSetSnapToGrid: s.setSnapToGrid,
-    onSetSnapToShape: s.setSnapToShape,
+    onSetShowGuides: viewPreferencesSync?.handleSetShowGuides ?? s.setShowGuides,
+    onSetSnapToGrid: viewPreferencesSync?.handleSetSnapToGrid ?? s.setSnapToGrid,
+    onSetSnapToShape: viewPreferencesSync?.handleSetSnapToShape ?? s.setSnapToShape,
     onAddGuide: dialogs.handleAddGuide,
     onAlignElements: manipulation.handleAlignElements,
     onDistributeElements: manipulation.handleDistributeElements,
@@ -11068,6 +11225,7 @@ function useViewerBuildingBlocksCore(input) {
     sections: state.sections,
     customShows: state.customShows,
     activeCustomShowId: state.activeCustomShowId,
+    presentationProperties: state.presentationProperties,
     mode,
     activeLayout: state.activeLayout,
     activeMaster: state.activeMaster,
@@ -11076,6 +11234,7 @@ function useViewerBuildingBlocksCore(input) {
   const { presentation, annotations, actionSoundHandlerRef, setExitModeHandler } = usePresentationSetup({
     mode,
     slides,
+    templateElementsBySlideId,
     visibleSlideIndexes,
     endWithBlackSlide: viewerOptions.advanced.slideShowEndWithBlackSlide,
     // File > Options > Advanced > "Prompt to keep ink annotations when
@@ -11120,6 +11279,111 @@ function useViewerBuildingBlocksCore(input) {
     viewerOptions
   };
 }
+function useCompatibilityToastsState() {
+  const [toasts, setToasts] = useState([]);
+  const dismiss = useCallback((id) => {
+    setToasts((prev) => prev.filter((toast) => toast.id !== id));
+  }, []);
+  const dismissAll = useCallback(() => {
+    setToasts([]);
+  }, []);
+  return { toasts, setToasts, dismiss, dismissAll };
+}
+function useReadOnlyRecommendationState(content) {
+  const [recommendation, setRecommendation] = useState(
+    () => readOnlyRecommendation(void 0)
+  );
+  const [bannerHidden, setBannerHidden] = useState(false);
+  const [editAnywayActive, setEditAnywayActive] = useState(false);
+  useEffect(() => {
+    setBannerHidden(false);
+    setEditAnywayActive(false);
+  }, [content]);
+  const editAnyway = useCallback(() => {
+    setEditAnywayActive(true);
+    setBannerHidden(true);
+  }, []);
+  const dismiss = useCallback(() => {
+    setBannerHidden(true);
+  }, []);
+  return {
+    recommendation,
+    setRecommendation,
+    /** Whether the viewer's `canEdit` should be forced off. */
+    locked: recommendation.defaultReadOnly && !editAnywayActive,
+    bannerVisible: recommendation.kind !== null && !bannerHidden,
+    editAnyway,
+    dismiss
+  };
+}
+function useViewPreferencesSync(input) {
+  const {
+    loadVersion,
+    viewProperties,
+    setViewProperties,
+    snapToGrid,
+    setSnapToGrid,
+    snapToShape,
+    setSnapToShape,
+    showGuides,
+    setShowGuides
+  } = input;
+  useEffect(() => {
+    const seeded = viewerPreferencesFromViewProperties(
+      { viewProperties },
+      { ...DEFAULT_VIEWER_PREFERENCES, snapToGrid, snapToObjects: snapToShape, showGuides }
+    );
+    setSnapToGrid(seeded.snapToGrid);
+    setSnapToShape(seeded.snapToObjects ?? snapToShape);
+    setShowGuides(seeded.showGuides ?? showGuides);
+  }, [loadVersion]);
+  const patchViewProperties = useCallback(
+    (prefsOverride) => {
+      setViewProperties((prev) => {
+        const merged = {
+          ...DEFAULT_VIEWER_PREFERENCES,
+          snapToGrid,
+          snapToObjects: snapToShape,
+          showGuides,
+          gridSpacingCx: prev?.gridSpacing?.cx,
+          gridSpacingCy: prev?.gridSpacing?.cy,
+          ...prefsOverride
+        };
+        const patch = viewPropertiesPatchFromPreferences(merged);
+        return {
+          ...prev,
+          slideViewPr: { ...prev?.slideViewPr, ...patch.slideViewPr },
+          ...patch.gridSpacing ? { gridSpacing: patch.gridSpacing } : {}
+        };
+      });
+    },
+    [setViewProperties, snapToGrid, snapToShape, showGuides]
+  );
+  const handleSetSnapToGrid = useCallback(
+    (value) => {
+      setSnapToGrid(value);
+      patchViewProperties({ snapToGrid: value });
+    },
+    [setSnapToGrid, patchViewProperties]
+  );
+  const handleSetSnapToShape = useCallback(
+    (value) => {
+      setSnapToShape(value);
+      patchViewProperties({ snapToObjects: value });
+    },
+    [setSnapToShape, patchViewProperties]
+  );
+  const handleSetShowGuides = useCallback(
+    (value) => {
+      setShowGuides(value);
+      patchViewProperties({ showGuides: value });
+    },
+    [setShowGuides, patchViewProperties]
+  );
+  return { handleSetSnapToGrid, handleSetSnapToShape, handleSetShowGuides };
+}
+
+// src/viewer/hooks/useViewerBuildingBlocksState.ts
 function useViewerBuildingBlocksState(input) {
   const { core, content, canEdit, filePath, autosaveEnabled, userName, handle, setContent } = input;
   const {
@@ -11175,6 +11439,8 @@ function useViewerBuildingBlocksState(input) {
     isDirty: state.isDirty,
     history
   });
+  const readOnlyRec = useReadOnlyRecommendationState(content);
+  const compatToastsState = useCompatibilityToastsState();
   useEffect(() => {
     state.setSelectedElementId(null);
     state.setSelectedElementIds([]);
@@ -11205,7 +11471,8 @@ function useViewerBuildingBlocksState(input) {
     handleSetMode,
     handleEnterPresenterView,
     handleEnterRehearsalMode,
-    autosaveStatus
+    autosaveStatus,
+    loadVersion
   } = useViewerIntegration({
     state,
     zoom,
@@ -11223,6 +11490,8 @@ function useViewerBuildingBlocksState(input) {
     // applies, so the headless building-blocks API loads http(s) images
     // under the same default-off, core-side SSRF/privacy guard.
     allowExternalImages: viewerOptions.trust.allowExternalContent,
+    setReadOnlyRecommendation: readOnlyRec.setRecommendation,
+    setCompatToasts: compatToastsState.setToasts,
     canEdit,
     promptKeepInkAnnotations: viewerOptions.advanced.slideShowPromptKeepInkAnnotations,
     imageExportScale,
@@ -11244,6 +11513,17 @@ function useViewerBuildingBlocksState(input) {
     onSlideCountChange
   });
   setExitModeHandler(handleSetMode);
+  const viewPreferencesSync = useViewPreferencesSync({
+    loadVersion,
+    viewProperties: state.viewProperties,
+    setViewProperties: state.setViewProperties,
+    snapToGrid: state.snapToGrid,
+    setSnapToGrid: state.setSnapToGrid,
+    snapToShape: state.snapToShape,
+    setSnapToShape: state.setSnapToShape,
+    showGuides: state.showGuides,
+    setShowGuides: state.setShowGuides
+  });
   return {
     dialogs,
     editorOps,
@@ -11253,7 +11533,8 @@ function useViewerBuildingBlocksState(input) {
     handleSetMode,
     handleEnterPresenterView,
     handleEnterRehearsalMode,
-    autosaveStatus
+    autosaveStatus,
+    viewPreferencesSync
   };
 }
 
@@ -11326,7 +11607,8 @@ function useViewerBuildingBlocks(input) {
     handleSetMode,
     handleEnterPresenterView,
     handleEnterRehearsalMode,
-    autosaveStatus
+    autosaveStatus,
+    viewPreferencesSync
   } = useViewerBuildingBlocksState({
     core,
     content,
@@ -11371,7 +11653,8 @@ function useViewerBuildingBlocks(input) {
     onOpenFile,
     onOpenRecentFile,
     fileName,
-    hiddenActions
+    hiddenActions,
+    viewPreferencesSync
   });
   const canvasProps = buildCanvasProps({
     mode,
@@ -11469,4 +11752,4 @@ function useResizablePanels() {
   };
 }
 
-export { ACTION_VERB_MAP, MIN_TOUCH_TARGET, ViewerOptionsContext, computeToolbarVisibility, detectTargetType, isAudienceTab, parseAudienceNonce, parseEmailUrl, parseSlideFromUrl, renderToCanvas, scopeLayoutOptionsToActiveSlide, useAnimationPlayback, useAnnotationHandlers, useAudienceMode, useAutosave, useBroadcastFollower, useCanvasInteractions, useClipboardHandlers, useCollaborationLivePatch, useCollaborativeHistory, useCollaborativeState, useComments, useContentLifecycle, useDerivedElementState, useDerivedSlideState, useDialogCustomShows, useEditorHistory, useEditorOperations, useElementManipulation, useElementOperations, useExportHandlers, useExportSaveAs, useFindReplace, useFollowMode, useFontInjection, useGroupAlignLayerHandlers, useIOHandlers, useInsertElements, useIsMobile, useKeyboardInsets, useKeyboardShortcutWiring, useKeyboardShortcuts, useLayoutSwitching, useLoadContent, useMergeShapesHandler, useModalDismissDrag, usePointerHandlers, usePresenceTracking, usePresentationAnnotations, usePresentationKeyboard, usePresentationMode, usePresentationSetup, usePresenterWindow, usePrintHandlers, usePropertyHandlers, useRecoveryDetection, useReducedMotion, useRehearsalTimings, useResizablePanels, useSectionOperations, useSerialize, useSheetDismissDrag, useSlideManagement, useSlideNavigation, useSwipeNavigation, useTableOperations, useThemeHandlers, useThemeSwitching, useToolbarVisibility, useTouchGestures, useViewerBuildingBlocks, useViewerCoreState, useViewerDialogs, useViewerIntegration, useViewerOptions, useViewerOptionsContext, useViewerState, useViewerUIState, useVirtualizedSlides, useYjsDocumentSync, useYjsProvider, useZoomNavigation, useZoomViewport };
+export { ACTION_VERB_MAP, MIN_TOUCH_TARGET, ViewerOptionsContext, computeToolbarVisibility, detectTargetType, isAudienceTab, parseAudienceNonce, parseEmailUrl, parseSlideFromUrl, renderToCanvas, safePrompt, scopeLayoutOptionsToActiveSlide, syncSelectionHandleOverlay, useAnimationPlayback, useAnnotationHandlers, useAudienceMode, useAutosave, useBroadcastFollower, useCanvasInteractions, useClipboardHandlers, useCollaborationLivePatch, useCollaborativeHistory, useCollaborativeState, useComments, useCompatibilityToastsState, useContentLifecycle, useDerivedElementState, useDerivedSlideState, useDialogCustomShows, useEditorHistory, useEditorOperations, useElementManipulation, useElementOperations, useExportHandlers, useExportSaveAs, useFindReplace, useFollowMode, useFontInjection, useGroupAlignLayerHandlers, useIOHandlers, useInsertElements, useIsMobile, useKeyboardInsets, useKeyboardShortcutWiring, useKeyboardShortcuts, useLayoutSwitching, useLoadContent, useMergeShapesHandler, useModalDismissDrag, usePointerHandlers, usePresenceTracking, usePresentationAnnotations, usePresentationKeyboard, usePresentationMode, usePresentationSetup, usePresenterWindow, usePrintHandlers, usePropertyHandlers, useReadOnlyRecommendationState, useRecoveryDetection, useReducedMotion, useRehearsalTimings, useResizablePanels, useSectionOperations, useSerialize, useSheetDismissDrag, useSlideManagement, useSlideNavigation, useSwipeNavigation, useTableOperations, useThemeHandlers, useThemeSwitching, useToolbarVisibility, useTouchGestures, useViewPreferencesSync, useViewerBuildingBlocks, useViewerCoreState, useViewerDialogs, useViewerIntegration, useViewerOptions, useViewerOptionsContext, useViewerState, useViewerUIState, useVirtualizedSlides, useYjsDocumentSync, useYjsProvider, useZoomNavigation, useZoomViewport };