pptx-react-viewer 2.16.0 → 2.16.2

package/dist/{chunk-ULB35HMJ.mjs → chunk-QI2JCXTH.mjs}

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

package/dist/{chunk-TWPZJXLC.mjs → chunk-UWYHBCLM.mjs}

@@ -1,6 +1,6 @@
-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-FFBY2TKD.mjs';
+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-Z4CS2ZYN.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, 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, 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, mapPresentationWheel, 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-OIITLGKQ.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, 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, 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, mapPresentationWheel, 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-MDFCBYEM.mjs';
 import { useRef, useState, useEffect, useCallback, useMemo, useLayoutEffect, useSyncExternalStore, useImperativeHandle } from 'react';
 import JSZip from 'jszip';
 import { useTranslation } from 'react-i18next';
@@ -2546,11 +2546,15 @@ function usePresentationMode(input) {
     }
     return merged;
   }, [morphPlan, presentationElementStates]);
-  const morphedKeyframesCss = useMemo(
-    () => morphPlan ? `${presentationKeyframesCss ?? ""}
-${morphPlan.keyframesCss}` : presentationKeyframesCss,
-    [morphPlan, presentationKeyframesCss]
-  );
+  const morphedKeyframesCss = useMemo(() => {
+    if (!morphPlan) {
+      return presentationKeyframesCss;
+    }
+    const imageRules = buildMorphAnimationRules(morphPlan, "", "incoming", "image");
+    return `${presentationKeyframesCss ?? ""}
+${morphPlan.keyframesCss}
+${imageRules}`;
+  }, [morphPlan, presentationKeyframesCss]);
   return {
     presentationSlideIndex,
     setPresentationSlideIndex,

package/dist/{chunk-FFBY2TKD.mjs → chunk-Z4CS2ZYN.mjs}

@@ -1,11 +1,11 @@
 import { translationsEn } from './chunk-5YV26HMJ.mjs';
-import { SHAPE_PRESET_DEFS, computeValueRangeForChart, VIEWER_SHORTCUT_REFERENCE, getAnimationInitialStyle, cloneHistorySnapshot, hasShapeProperties, isTemplateElement, getImageFitStyle, isImageLikeElement, runMediaCommand, findMediaElementByElementId, mediaPlaybackAttributes, buildTextBlockStyle, hasTextProperties, toCssWritingMode, toCssTextOrientation, toCssVerticalDirection, getKinsokuLineBreakStyles, buildTextBody3DSceneStyle, resolveParagraphRtl, resolveParagraphAlign, resolveCssTextAlign, resolveParagraphStrutFontSize, colorWithOpacity, normalizeHexColor, build3DExtrusionData, isIdentityRectClip, getResolvedShapeClipPath, isStrokeOnlyPresetElement, normalizeStrokeDashType, buildCssGradientFromShapeStyle, buildShadowCssFromShapeStyle, buildInnerShadowCssFromShapeStyle, suppressesCssBorder, buildMultiLayerShadowCss, buildGlowBoxShadow, getCompoundLineBoxShadow, getSoftEdgeFilterId, getEffectDagFilter, buildPatternFillCss, buildReflectionCss, getCssBorderDashStyle, getCompoundLineBorderWidth, getSvgStrokeDasharray, buildSvgGradientDef, isCalloutShape, getCalloutLeaderLineGeometry, buildCalloutLeaderLineSvgPath, getCalloutViewBoxBounds, svgLineCap, getCompoundLineOffsets, getCompoundLineWidths, computeSelectionRect, DEFAULT_FONT_FAMILY, rectToCells, isCellInRect, buildChartViewModel, buildNotesPdfBytes, buildSlidesPdfBytes, buildPreviewAnimation, buildMotionPathPreview, getRoundRectRadiusPx2, registerPersistentAudio, proportionalLineHeight, substituteFieldText, resolveUnderlineDecorationStyle, POWERPOINT_METRIC_TRACKING, resolveAutoFitFontScale, getSubstituteFontFamily, parsePanoseString, hasDistinctScriptFonts, buildTextReflectionCss, getTextAlphaOpacity, buildTextRunFilterChain, buildTextShadowCss, TEXT_BUILD_ID_SEP, buildTextBuildSpec, textBuildSpanStyle, sanitizeGradientStops, getGradientTileFlipCss, getGradientTileRectCss, apply3dEffects, clampUnitInterval, customGeometryPathsToSvgSubpaths, svgGradientFillRef, computeColumnBoundaries, parseDrawingColor, parseDrawingColorOpacity, getCellDiagonalBorders, getPatternSvg, ooxmlDashToCssBorderStyle, cell3DBevelCss, getChartStylePalette, chartAreaFill, computeLayout, valueToY, formatAxisValue, computeLayoutOptions, splitSeriesByAxis, computeValueRange, getSecondaryValueAxis, seriesColor, paletteColor, resolveRegionCode, normalizeValue, sequentialColorScale, convertOmmlToMathMl, sanitizeMathMl, buildTextFillCss, resolvePictureBullet, computeResizedColumnWidths, computeResizedRowHeight, DEFAULT_ROW_HEIGHT, resolveFontRefIdx, tintColor2, shadeColor2, ooxmlGradientAngleToCssDegrees, segmentByScript, resolveFontForScript, generateLogTicks, formatAxisValueWithUnits, getDisplayUnitLabel, hexToRgbChannels, chartPartToAttrs } from './chunk-OIITLGKQ.mjs';
+import { SHAPE_PRESET_DEFS, computeValueRangeForChart, VIEWER_SHORTCUT_REFERENCE, getAnimationInitialStyle, cloneHistorySnapshot, hasShapeProperties, isTemplateElement, getImageFitStyle, isImageLikeElement, runMediaCommand, findMediaElementByElementId, mediaPlaybackAttributes, buildTextBlockStyle, hasTextProperties, toCssWritingMode, toCssTextOrientation, toCssVerticalDirection, getKinsokuLineBreakStyles, buildTextBody3DSceneStyle, resolveParagraphRtl, resolveParagraphAlign, resolveCssTextAlign, resolveParagraphStrutFontSize, colorWithOpacity, normalizeHexColor, build3DExtrusionData, isIdentityRectClip, getResolvedShapeClipPath, isStrokeOnlyPresetElement, normalizeStrokeDashType, buildCssGradientFromShapeStyle, buildShadowCssFromShapeStyle, buildInnerShadowCssFromShapeStyle, suppressesCssBorder, buildMultiLayerShadowCss, buildGlowBoxShadow, getCompoundLineBoxShadow, getSoftEdgeFilterId, getEffectDagFilter, buildPatternFillCss, buildReflectionCss, getCssBorderDashStyle, getCompoundLineBorderWidth, getSvgStrokeDasharray, buildSvgGradientDef, isCalloutShape, getCalloutLeaderLineGeometry, buildCalloutLeaderLineSvgPath, getCalloutViewBoxBounds, svgLineCap, getCompoundLineOffsets, getCompoundLineWidths, computeSelectionRect, DEFAULT_FONT_FAMILY, rectToCells, isCellInRect, buildChartViewModel, buildNotesPdfBytes, buildSlidesPdfBytes, buildPreviewAnimation, buildMotionPathPreview, getRoundRectRadiusPx2, mediaFallbackVisual, registerPersistentAudio, proportionalLineHeight, substituteFieldText, resolveUnderlineDecorationStyle, resolveAutoFitFontScale, getSubstituteFontFamily, parsePanoseString, hasDistinctScriptFonts, pieceLetterSpacing, resolveMetricTrackingPx, buildTextReflectionCss, getTextAlphaOpacity, buildTextRunFilterChain, buildTextShadowCss, TEXT_BUILD_ID_SEP, buildTextBuildSpec, textBuildSpanStyle, sanitizeGradientStops, getGradientTileFlipCss, getGradientTileRectCss, apply3dEffects, clampUnitInterval, customGeometryPathsToSvgSubpaths, svgGradientFillRef, computeColumnBoundaries, parseDrawingColor, parseDrawingColorOpacity, getCellDiagonalBorders, getPatternSvg, ooxmlDashToCssBorderStyle, cell3DBevelCss, getChartStylePalette, chartAreaFill, computeLayout, valueToY, formatAxisValue, computeLayoutOptions, splitSeriesByAxis, computeValueRange, getSecondaryValueAxis, seriesColor, paletteColor, resolveRegionCode, normalizeValue, sequentialColorScale, mediaFallbackIcon, mediaFallbackLabelKey, MEDIA_CHROME_ATTRIBUTE, convertOmmlToMathMl, sanitizeMathMl, buildTextFillCss, resolvePictureBullet, computeResizedColumnWidths, computeResizedRowHeight, DEFAULT_ROW_HEIGHT, resolveFontRefIdx, tintColor2, shadeColor2, ooxmlGradientAngleToCssDegrees, generateLogTicks, formatAxisValueWithUnits, getDisplayUnitLabel, splitRunForMetrics, hexToRgbChannels, chartPartToAttrs, segmentByScript, resolveFontForScript } from './chunk-MDFCBYEM.mjs';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import React6, { useState, useEffect, useMemo, Suspense, useRef, useCallback, useLayoutEffect } from 'react';
 import { LuTriangle, LuPlus, LuMoveRight, LuMinus, LuDiamond, LuDatabase, LuCircle, LuSquare } from 'react-icons/lu';
-import { useTranslation } from 'react-i18next';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useTranslation } from 'react-i18next';
 
 // src/viewer/utils/animation-effects.ts
 function getAnimationInitialStyle2(preset, nativeAnimation) {
@@ -544,36 +544,6 @@ function CaptionTrackRenderer({
     );
   }) });
 }
-function MediaNotFoundPlaceholder({
-  mediaType
-}) {
-  const { t } = useTranslation();
-  const isVideo = mediaType === "video";
-  return /* @__PURE__ */ jsxs("div", { className: "w-full h-full flex flex-col items-center justify-center gap-2 pointer-events-none bg-black/30 rounded border border-dashed border-white/20", children: [
-    /* @__PURE__ */ jsx(
-      "svg",
-      {
-        width: "36",
-        height: "36",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeWidth: "1.5",
-        className: "text-white/50",
-        children: isVideo ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx("rect", { x: "2", y: "4", width: "20", height: "16", rx: "2" }),
-          /* @__PURE__ */ jsx("line", { x1: "2", y1: "4", x2: "22", y2: "20" })
-        ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
-          /* @__PURE__ */ jsx("line", { x1: "4", y1: "4", x2: "20", y2: "20" })
-        ] })
-      }
-    ),
-    /* @__PURE__ */ jsx("span", { className: "text-[10px] text-white/50", children: t("pptx.media.typeNotFound", {
-      type: isVideo ? t("pptx.file.video") : t("pptx.file.audio")
-    }) })
-  ] });
-}
 function VideoWithMetadata({
   element,
   mediaRef,
@@ -896,6 +866,109 @@ function PresentationMediaController({
     )
   ] });
 }
+function label(key) {
+  return key === void 0 ? void 0 : translationsEn[key];
+}
+function FallbackIcon({
+  paths,
+  size,
+  className
+}) {
+  if (paths.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      className,
+      children: paths.map((d) => /* @__PURE__ */ jsx("path", { d }, d))
+    }
+  );
+}
+function Badge({
+  visual,
+  element
+}) {
+  if (visual.badge === "none") {
+    return null;
+  }
+  const isMissing = visual.badge === "missing";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `absolute inset-0 flex flex-col items-center justify-center ${isMissing ? "gap-1" : ""}`,
+      ...{ [MEDIA_CHROME_ATTRIBUTE]: visual.badge },
+      children: [
+        /* @__PURE__ */ jsx(
+          FallbackIcon,
+          {
+            paths: mediaFallbackIcon(visual, element.mediaType),
+            size: isMissing ? 32 : 48,
+            className: isMissing ? "text-white/60" : "text-white/80 drop-shadow-md"
+          }
+        ),
+        isMissing && /* @__PURE__ */ jsx("span", { className: "text-[10px] text-white/60", children: label(mediaFallbackLabelKey(visual, element.mediaType)) })
+      ]
+    }
+  );
+}
+function Placeholder({
+  visual,
+  element
+}) {
+  if (visual.placeholder === "none") {
+    return null;
+  }
+  const isMissing = visual.placeholder === "missing";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `w-full h-full flex flex-col items-center justify-center gap-1 pointer-events-none rounded ${isMissing ? "bg-black/30 border border-dashed border-white/20" : element.mediaType === "audio" ? "bg-black/10" : "bg-black/20"}`,
+      ...{ [MEDIA_CHROME_ATTRIBUTE]: visual.placeholder },
+      children: [
+        /* @__PURE__ */ jsx(
+          FallbackIcon,
+          {
+            paths: mediaFallbackIcon(visual, element.mediaType),
+            size: isMissing ? 36 : element.mediaType === "audio" ? 24 : 32,
+            className: isMissing ? "text-white/50" : "text-white/70"
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: `text-[10px] ${isMissing ? "text-white/50" : "text-white/70"}`, children: label(mediaFallbackLabelKey(visual, element.mediaType)) })
+      ]
+    }
+  );
+}
+function renderMediaFallback({
+  element,
+  posterUrl,
+  surface
+}) {
+  const visual = mediaFallbackVisual(surface, {
+    hasPoster: Boolean(posterUrl),
+    missing: element.mediaMissing === true
+  });
+  if (visual.poster && posterUrl) {
+    return /* @__PURE__ */ jsxs("div", { className: "w-full h-full relative pointer-events-none", children: [
+      /* @__PURE__ */ jsx(
+        "img",
+        {
+          src: posterUrl,
+          alt: visual.dimPoster ? translationsEn["pptx.media.posterAlt"] : translationsEn["pptx.media.videoPosterAlt"],
+          className: `w-full h-full object-contain${visual.dimPoster ? " opacity-50" : ""}`
+        }
+      ),
+      /* @__PURE__ */ jsx(Badge, { visual, element })
+    ] });
+  }
+  return /* @__PURE__ */ jsx(Placeholder, { visual, element });
+}
 function renderMediaElement(element, mediaDataUrls, options) {
   if (element.type !== "media") {
     return /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center text-[11px] text-white/80 pointer-events-none", children: translationsEn["pptx.media.title"] });
@@ -911,39 +984,12 @@ function renderMediaElement(element, mediaDataUrls, options) {
   const isFullScreen = options?.fullScreen === true;
   const isPresentationMode = options?.isPresentationMode === true;
   const showTransport = options?.showTransport ?? !isPresentationMode;
+  const surface = {
+    presenting: isPresentationMode,
+    preview: options?.preview === true
+  };
   if (element.mediaMissing) {
-    if (posterUrl) {
-      return /* @__PURE__ */ jsxs("div", { className: "w-full h-full relative pointer-events-none", children: [
-        /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: posterUrl,
-            alt: translationsEn["pptx.media.posterAlt"],
-            className: "w-full h-full object-contain opacity-50"
-          }
-        ),
-        /* @__PURE__ */ jsxs("div", { className: "absolute inset-0 flex flex-col items-center justify-center gap-1", children: [
-          /* @__PURE__ */ jsxs(
-            "svg",
-            {
-              width: "32",
-              height: "32",
-              viewBox: "0 0 24 24",
-              fill: "none",
-              stroke: "currentColor",
-              strokeWidth: "1.5",
-              className: "text-white/60",
-              children: [
-                /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
-                /* @__PURE__ */ jsx("line", { x1: "4", y1: "4", x2: "20", y2: "20" })
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsx("span", { className: "text-[10px] text-white/60", children: translationsEn["pptx.media.notFound"] })
-        ] })
-      ] });
-    }
-    return /* @__PURE__ */ jsx(MediaNotFoundPlaceholder, { mediaType: mediaType ?? "video" });
+    return renderMediaFallback({ element, posterUrl, surface });
   }
   if (mediaType === "video") {
     if (dataUrl) {
@@ -976,47 +1022,7 @@ function renderMediaElement(element, mediaDataUrls, options) {
         }
       );
     }
-    if (posterUrl) {
-      return /* @__PURE__ */ jsxs("div", { className: "w-full h-full relative pointer-events-none", children: [
-        /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: posterUrl,
-            alt: translationsEn["pptx.media.videoPosterAlt"],
-            className: "w-full h-full object-contain"
-          }
-        ),
-        /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsx(
-          "svg",
-          {
-            width: "48",
-            height: "48",
-            viewBox: "0 0 24 24",
-            fill: "none",
-            stroke: "currentColor",
-            strokeWidth: "1.5",
-            className: "text-white/80 drop-shadow-md",
-            children: /* @__PURE__ */ jsx("polygon", { points: "5 3 19 12 5 21 5 3" })
-          }
-        ) })
-      ] });
-    }
-    return /* @__PURE__ */ jsxs("div", { className: "w-full h-full flex flex-col items-center justify-center gap-1 pointer-events-none bg-black/20 rounded", children: [
-      /* @__PURE__ */ jsx(
-        "svg",
-        {
-          width: "32",
-          height: "32",
-          viewBox: "0 0 24 24",
-          fill: "none",
-          stroke: "currentColor",
-          strokeWidth: "1.5",
-          className: "text-white/70",
-          children: /* @__PURE__ */ jsx("polygon", { points: "5 3 19 12 5 21 5 3" })
-        }
-      ),
-      /* @__PURE__ */ jsx("span", { className: "text-[10px] text-white/70", children: "Video" })
-    ] });
+    return renderMediaFallback({ element, posterUrl, surface });
   }
   if (mediaType === "audio") {
     if (dataUrl) {
@@ -1046,28 +1052,12 @@ function renderMediaElement(element, mediaDataUrls, options) {
         }
       );
     }
-    return /* @__PURE__ */ jsxs("div", { className: "w-full h-full flex flex-col items-center justify-center gap-1 pointer-events-none bg-black/10 rounded", children: [
-      /* @__PURE__ */ jsxs(
-        "svg",
-        {
-          width: "24",
-          height: "24",
-          viewBox: "0 0 24 24",
-          fill: "none",
-          stroke: "currentColor",
-          strokeWidth: "1.5",
-          className: "text-white/70",
-          children: [
-            /* @__PURE__ */ jsx("path", { d: "M9 18V5l12-2v13" }),
-            /* @__PURE__ */ jsx("circle", { cx: "6", cy: "18", r: "3" }),
-            /* @__PURE__ */ jsx("circle", { cx: "18", cy: "16", r: "3" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsx("span", { className: "text-[10px] text-white/70", children: "Audio" })
-    ] });
+    return renderMediaFallback({ element, posterUrl, surface });
+  }
+  if (surface.presenting || surface.preview) {
+    return null;
   }
-  return /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center text-[11px] text-white/80 pointer-events-none", children: "Media" });
+  return /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center text-[11px] text-white/80 pointer-events-none", children: translationsEn["pptx.media.title"] });
 }
 
 // src/viewer/utils/text-utils.tsx
@@ -1541,12 +1531,34 @@ function renderScriptAwareText(text, needsScriptFonts, scriptFonts, baseFontFami
     return /* @__PURE__ */ jsx("span", { style: { fontFamily: font }, children: run.text }, `${keyPrefix}-r${i}`);
   });
 }
-function renderSegmentContent(elementId, segmentIndex, textValue, lines, needsScriptFonts, scriptFonts, baseFontFamily, findHighlights, tabContext) {
+function renderMetricPieces(text, metric, keyPrefix, inner) {
+  if (!metric || !text) {
+    return inner(text, keyPrefix);
+  }
+  const pieces = splitRunForMetrics(text, metric.font);
+  if (pieces.length <= 1) {
+    return inner(text, keyPrefix);
+  }
+  return pieces.map((piece, i) => /* @__PURE__ */ jsx(
+    "span",
+    {
+      style: { letterSpacing: pieceLetterSpacing(metric.authoredPx, piece.tracking) },
+      children: inner(piece.text, `${keyPrefix}-w${i}`)
+    },
+    `${keyPrefix}-w${i}`
+  ));
+}
+function renderSegmentContent(elementId, segmentIndex, textValue, lines, needsScriptFonts, scriptFonts, baseFontFamily, findHighlights, tabContext, metric) {
   const segHl = findHighlights?.get(segmentIndex);
   if (!segHl || segHl.length === 0) {
     return lines.map((line, lineIndex) => {
       const lineKey = `${elementId}-seg-${segmentIndex}-line-${lineIndex}`;
-      const renderPiece = (text, key) => renderScriptAwareText(text, needsScriptFonts, scriptFonts, baseFontFamily, key);
+      const renderPiece = (text, key) => renderMetricPieces(
+        text,
+        metric,
+        key,
+        (pieceText, pieceKey) => renderScriptAwareText(pieceText, needsScriptFonts, scriptFonts, baseFontFamily, pieceKey)
+      );
       return /* @__PURE__ */ jsxs(React6.Fragment, { children: [
         tabContext && line.includes("	") ? renderTabbedLine(line, tabContext, lineKey, renderPiece) : renderPiece(line, lineKey),
         lineIndex < lines.length - 1 ? /* @__PURE__ */ jsx("br", {}) : null
@@ -1578,8 +1590,15 @@ function renderSegmentContent(elementId, segmentIndex, textValue, lines, needsSc
       isCurrent: false
     });
   }
-  return chunks.map(
-    (chunk, ci) => chunk.highlighted ? /* @__PURE__ */ jsx(
+  const renderChunk = (text, key) => renderMetricPieces(
+    text,
+    metric,
+    key,
+    (pieceText, pieceKey) => renderScriptAwareText(pieceText, needsScriptFonts, scriptFonts, baseFontFamily, pieceKey)
+  );
+  return chunks.map((chunk, ci) => {
+    const chunkKey = `${elementId}-seg-${segmentIndex}-hl-${ci}`;
+    return chunk.highlighted ? /* @__PURE__ */ jsx(
       "mark",
       {
         style: {
@@ -1587,23 +1606,11 @@ function renderSegmentContent(elementId, segmentIndex, textValue, lines, needsSc
           color: "inherit",
           borderRadius: 2
         },
-        children: renderScriptAwareText(
-          chunk.text,
-          needsScriptFonts,
-          scriptFonts,
-          baseFontFamily,
-          `${elementId}-seg-${segmentIndex}-hl-${ci}`
-        )
+        children: renderChunk(chunk.text, chunkKey)
       },
-      `${elementId}-seg-${segmentIndex}-hl-${ci}`
-    ) : /* @__PURE__ */ jsx(React6.Fragment, { children: renderScriptAwareText(
-      chunk.text,
-      needsScriptFonts,
-      scriptFonts,
-      baseFontFamily,
-      `${elementId}-seg-${segmentIndex}-hl-${ci}`
-    ) }, `${elementId}-seg-${segmentIndex}-hl-${ci}`)
-  );
+      chunkKey
+    ) : /* @__PURE__ */ jsx(React6.Fragment, { children: renderChunk(chunk.text, chunkKey) }, chunkKey);
+  });
 }
 function renderEquationSegment(elementId, segmentIndex, equationXml, equationNumber) {
   const mathml = convertOmmlToMathMl(equationXml);
@@ -1726,7 +1733,7 @@ function renderSingleSegment(element, segment, segmentIndex, fallbackColor, find
   const rawBaseline = typeof segmentStyle.baseline === "number" ? segmentStyle.baseline : 0;
   const baselineFraction = rawBaseline === 0 ? 0 : Math.abs(rawBaseline) >= 1e3 ? rawBaseline / 1e5 : rawBaseline / 100;
   const baselineFontScale = baselineFraction !== 0 ? 0.65 : 1;
-  const letterSpacing = typeof segmentStyle.characterSpacing === "number" && segmentStyle.characterSpacing !== 0 ? `calc(${segmentStyle.characterSpacing / 100 * (96 / 72)}px + ${POWERPOINT_METRIC_TRACKING})` : POWERPOINT_METRIC_TRACKING;
+  const authoredLetterSpacing = typeof segmentStyle.characterSpacing === "number" && segmentStyle.characterSpacing !== 0 ? segmentStyle.characterSpacing / 100 * (96 / 72) : 0;
   const textFillStyles = buildTextFillCss2(segmentStyle);
   const rawFontSize = segmentStyle.fontSize || element.textStyle?.fontSize || DEFAULT_TEXT_FONT_SIZE;
   const autoFitScale = resolveAutoFitFontScale(element.textStyle);
@@ -1756,6 +1763,17 @@ function renderSingleSegment(element, segment, segmentIndex, fallbackColor, find
     )
   };
   const needsScriptFonts = hasDistinctScriptFonts(scriptFonts);
+  const metricFont = {
+    fontFamily: baseFontFamily,
+    fontSizePx: baseFontSize * baselineFontScale,
+    bold: Boolean(segmentStyle.bold),
+    italic: Boolean(segmentStyle.italic)
+  };
+  const metricContext = { font: metricFont, authoredPx: authoredLetterSpacing };
+  const letterSpacing = pieceLetterSpacing(
+    authoredLetterSpacing,
+    resolveMetricTrackingPx(textValue, metricFont)
+  );
   const spanStyle = {
     color: resolvedSegmentColor,
     fontSize: baseFontSize * baselineFontScale,
@@ -1835,7 +1853,8 @@ function renderSingleSegment(element, segment, segmentIndex, fallbackColor, find
       baseFontFamily,
       Boolean(segmentStyle.bold),
       Boolean(segmentStyle.italic)
-    )
+    ),
+    metricContext
   );
   let innerContent;
   if (hasRuby) {
@@ -6162,7 +6181,7 @@ function FailedToLoad() {
 var LazySurfaceChart3DScene = React6.lazy(
   async () => {
     try {
-      return await import('./SurfaceChart3DScene-RPRVXRQZ.mjs');
+      return await import('./SurfaceChart3DScene-MODEHQ6G.mjs');
     } catch {
       return { default: FailedToLoad };
     }
@@ -6494,7 +6513,7 @@ function renderTreemapChart(element, chartData, categoryLabels) {
         `${element.id}-tm-${item.index}`
       )
     );
-    const label = categoryLabels[item.index] ?? `${item.index + 1}`;
+    const label2 = categoryLabels[item.index] ?? `${item.index + 1}`;
     if (w > 30 && h > 14) {
       rects.push(
         /* @__PURE__ */ jsx(
@@ -6506,7 +6525,7 @@ function renderTreemapChart(element, chartData, categoryLabels) {
             fontSize: Math.min(10, h * 0.3),
             fill: "#fff",
             fontWeight: 600,
-            children: label
+            children: label2
           },
           `${element.id}-tm-lbl-${item.index}`
         )
@@ -6973,14 +6992,14 @@ function layoutToCategory(layout) {
   };
   return map[layout] ?? "list";
 }
-function smartArtNodeGroupProps(nodeId, shadow, label) {
+function smartArtNodeGroupProps(nodeId, shadow, label2) {
   const props = {
     "data-smartart-node-id": nodeId,
     style: { filter: shadow, pointerEvents: "auto" }
   };
-  if (label) {
+  if (label2) {
     props.role = "img";
-    props["aria-label"] = label;
+    props["aria-label"] = label2;
   }
   return props;
 }