pptx-react-viewer 4.25.0 → 4.27.0

package/dist/chunk-DC67MV5I.mjs

@@ -1,3915 +0,0 @@
-import { SHAPE_PRESET_DEFS, VIEWER_SHORTCUT_REFERENCE, STROKE_DASH_OPTIONS, getAnimationInitialStyle, cloneHistorySnapshot, hasShapeProperties, getImageFitStyle, getImageFillCounterTransform, getComputedFillStyle, isImageLikeElement, getCropShapeClipPath, getImageTilingStyle, mediaPlaybackAttributes, getOnlineVideoEmbed, ONLINE_VIDEO_IFRAME_SANDBOX, ONLINE_VIDEO_IFRAME_ALLOW, buildTextBlockStyle, hasTextProperties, toCssWritingMode, toCssTextOrientation, toCssVerticalDirection, buildTextBodyLayoutStyle, buildTextBody3DSceneStyle, buildParagraphs, followingText, colorWithOpacity, normalizeHexColor, hexToRgbUnit, build3DExtrusionData, getComputedEffectStyle, getComputedStrokeStyle, getAnimationColorBaseStyle, isStrokeOnlyPresetElement, resolveShapeGeometry, getConnectorPathGeometry, normalizeStrokeDashType, getSvgStrokeDasharray, buildSvgGradientDef, buildStrokeOutline, getPresetShapeVectorGeometry, isWedgeCalloutPresetShape, svgGradientFillRef, isCalloutShape, getCalloutLeaderLineGeometry, buildCalloutLeaderLineSvgPath, getCalloutViewBoxBounds, svgLineCap, getCompoundLineOffsets, getCompoundLineWidths, canDrillDown, computeSelectionRect, DEFAULT_FONT_FAMILY, cellStyleToCss, rectToCells, isCellInRect, tableContainerCss, buildChartViewModel, resolveChartKind, chartPreserveAspectRatio, buildNotesPdfBytes, buildTiledSlidesPdfBytes, buildPreviewAnimation, measurePreviewGeometry, buildMotionPathPreview, mediaFallbackVisual, scheduleMediaTrimAndFade, registerCrossSlideAudio, shouldShowMediaFullscreenStopButton, withInlineListDecorationDefaults, segmentStyleToCss, resolveAutoFitFontScale, applyUnderlineVariant, nestedTextDecorationStyle, scaleFontSizeForAutoFit, resolveFontKerning, getSubstituteFontFamily, parsePanoseString, resolveScriptFontSet, hasDistinctScriptFonts, authoredLetterSpacingPx, pieceLetterSpacing, resolveMetricTrackingPx, hollowTextFillStyle, splitsUnderlineIntoWords, stripUnderlineDecoration, buildTabContext, TEXT_BUILD_ID_SEP, buildTextBuildSpec, textBuildSpanStyle, apply3dEffects, customGeometryPathsToSvgSubpaths, buildSubpathPaints, computeColumnBoundaries, getTableCellBandStyle, parseDrawingColor, parseDrawingColorOpacity, getCellDiagonalBorders, xmlText, cellRunStyle, getChartStylePalette, computeChartLegendLayout, mediaFallbackIcon, mediaFallbackLabelKey, MEDIA_CHROME_ATTRIBUTE, convertOmmlToMathMl, sanitizeMathMl, tableCellCss, computeResizedColumnWidths, computeResizedRowHeight, DEFAULT_ROW_HEIGHT, ooxmlGradientAngleToCssDegrees, buildRectPathGradient, buildRunTabLines, chartPartToAttrs, splitWordsForUnderline, splitRunForMetrics, splitEastAsianBreaks, splitRunByScriptFont } from './chunk-5FEQK3MW.mjs';
-import { translationsEn } from './chunk-Q4HRYUEP.mjs';
-import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-import React8, { useRef, useState, useEffect, useCallback, useMemo, useLayoutEffect } from 'react';
-import { LuTriangle, LuPlus, LuMoveRight, LuMinus, LuDiamond, LuDatabase, LuCircle, LuSquare } from 'react-icons/lu';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { useTranslation } from 'react-i18next';
-
-// src/viewer/utils/animation-effects.ts
-function getAnimationInitialStyle2(preset, nativeAnimation) {
-  return getAnimationInitialStyle(preset, nativeAnimation);
-}
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-// src/viewer/utils/clone.ts
-function cloneHistorySnapshot2(snapshot) {
-  return cloneHistorySnapshot(snapshot);
-}
-
-// src/viewer/constants/scalar.ts
-var DEFAULT_CANVAS_WIDTH = 1280;
-var DEFAULT_CANVAS_HEIGHT = 720;
-var MIN_ELEMENT_SIZE = 12;
-var EMU_PER_PX = 9525;
-var DEFAULT_BODY_INSET_TB_PX = 45720 / 9525;
-var DEFAULT_TEXT_COLOR = "#111827";
-var DEFAULT_FILL_COLOR = "#3b82f6";
-var DEFAULT_STROKE_COLOR = "#1f2937";
-var DEFAULT_FONT_FAMILY2 = '"Segoe UI", "Helvetica Neue", Arial, sans-serif';
-var DEFAULT_TEXT_FONT_SIZE = 24;
-var HYPERLINK_COLOR = "#0563C1";
-var DEFAULT_TABLE_ROWS = 3;
-var DEFAULT_TABLE_COLUMNS = 3;
-var ZOOM_TO_SELECTION_PADDING = 96;
-var GRID_SIZE = 8;
-var SLIDE_NAV_THUMBNAIL_WIDTH = 156;
-var UNGROUPED_SECTION_ID = "__ungrouped__";
-var DEFAULT_SECTION_GROUP_ID = "default";
-
-// src/viewer/constants/toolbar.ts
-var TOOLBAR_SECTIONS = [
-  { id: "file", labelKey: "pptx.ribbon.tab.file" },
-  { id: "home", labelKey: "pptx.ribbon.tab.home" },
-  { id: "insert", labelKey: "pptx.ribbon.tab.insert" },
-  { id: "draw", labelKey: "pptx.ribbon.tab.draw" },
-  { id: "design", labelKey: "pptx.ribbon.tab.design" },
-  { id: "transitions", labelKey: "pptx.ribbon.tab.transitions" },
-  { id: "animations", labelKey: "pptx.ribbon.tab.animations" },
-  { id: "slideShow", labelKey: "pptx.ribbon.tab.slideShow" },
-  { id: "record", labelKey: "pptx.ribbon.tab.record" },
-  { id: "review", labelKey: "pptx.ribbon.tab.review" },
-  { id: "view", labelKey: "pptx.ribbon.tab.view" },
-  { id: "help", labelKey: "pptx.ribbon.tab.help" }
-];
-var SHORTCUT_REFERENCE_ITEMS = VIEWER_SHORTCUT_REFERENCE;
-
-// src/viewer/constants/transitions-animations.ts
-var ANIMATION_PRESET_OPTIONS = [
-  { value: "fadeIn", label: "Fade In", i18nKey: "pptx.animation.preset.fadeIn" },
-  { value: "flyIn", label: "Fly In", i18nKey: "pptx.animation.preset.flyIn" },
-  { value: "zoomIn", label: "Zoom In", i18nKey: "pptx.animation.preset.zoomIn" },
-  { value: "fadeOut", label: "Fade Out", i18nKey: "pptx.animation.preset.fadeOut" },
-  { value: "flyOut", label: "Fly Out", i18nKey: "pptx.animation.preset.flyOut" },
-  { value: "zoomOut", label: "Zoom Out", i18nKey: "pptx.animation.preset.zoomOut" },
-  { value: "spin", label: "Spin", i18nKey: "pptx.animation.preset.spin" },
-  { value: "pulse", label: "Pulse", i18nKey: "pptx.animation.preset.pulse" },
-  { value: "colorWave", label: "Color Wave", i18nKey: "pptx.animation.preset.colorWave" },
-  { value: "bounce", label: "Bounce", i18nKey: "pptx.animation.preset.bounce" },
-  { value: "flash", label: "Flash", i18nKey: "pptx.animation.preset.flash" },
-  { value: "growShrink", label: "Grow/Shrink", i18nKey: "pptx.animation.preset.growShrink" },
-  { value: "teeter", label: "Teeter", i18nKey: "pptx.animation.preset.teeter" }
-];
-var GLYPH_COMPONENTS = {
-  square: LuSquare,
-  circle: LuCircle,
-  database: LuDatabase,
-  diamond: LuDiamond,
-  minus: LuMinus,
-  moveRight: LuMoveRight,
-  plus: LuPlus,
-  triangle: LuTriangle
-};
-var SHAPE_PRESETS = SHAPE_PRESET_DEFS.map(
-  (def) => ({
-    type: def.type,
-    label: def.label,
-    i18nKey: def.i18nKey,
-    icon: React8.createElement(GLYPH_COMPONENTS[def.glyph], {
-      className: def.glyphClass ? `w-3.5 h-3.5 ${def.glyphClass}` : "w-3.5 h-3.5"
-    })
-  })
-);
-
-// src/viewer/constants/connectors-strokes.ts
-var CONNECTOR_ARROW_OPTIONS = [
-  { value: "none", label: "None", i18nKey: "pptx.arrowhead.none" },
-  { value: "triangle", label: "Triangle", i18nKey: "pptx.arrowhead.triangle" },
-  { value: "stealth", label: "Stealth", i18nKey: "pptx.arrowhead.stealth" },
-  { value: "diamond", label: "Diamond", i18nKey: "pptx.arrowhead.diamond" },
-  { value: "oval", label: "Oval", i18nKey: "pptx.arrowhead.oval" },
-  { value: "arrow", label: "Open Arrow", i18nKey: "pptx.arrowhead.openArrow" }
-];
-var ARROW_SIZE_OPTIONS = [
-  { value: "sm", label: "Small", i18nKey: "pptx.connectorOptions.sizeSmall" },
-  { value: "med", label: "Medium", i18nKey: "pptx.connectorOptions.sizeMedium" },
-  { value: "lg", label: "Large", i18nKey: "pptx.connectorOptions.sizeLarge" }
-];
-var STROKE_DASH_OPTIONS2 = STROKE_DASH_OPTIONS;
-
-// src/viewer/utils/shape-types.tsx
-function getShapeType(shapeType) {
-  if (!shapeType) {
-    return "rect";
-  }
-  const normalized = shapeType.toLowerCase();
-  if (normalized === "rect") {
-    return "rect";
-  }
-  if (normalized === "roundrect") {
-    return "roundRect";
-  }
-  if (normalized === "ellipse" || normalized === "oval") {
-    return "ellipse";
-  }
-  if (normalized === "cylinder" || normalized === "can") {
-    return "cylinder";
-  }
-  if (normalized === "triangle") {
-    return "triangle";
-  }
-  if (normalized === "rttriangle") {
-    return "rtTriangle";
-  }
-  if (normalized === "diamond") {
-    return "diamond";
-  }
-  if (normalized === "line") {
-    return "line";
-  }
-  if (normalized === "parallelogram") {
-    return "parallelogram";
-  }
-  if (normalized === "trapezoid") {
-    return "trapezoid";
-  }
-  if (normalized === "pentagon") {
-    return "pentagon";
-  }
-  if (normalized === "hexagon") {
-    return "hexagon";
-  }
-  if (normalized === "octagon") {
-    return "octagon";
-  }
-  if (normalized === "chevron") {
-    return "chevron";
-  }
-  if (normalized === "star5") {
-    return "star5";
-  }
-  if (normalized === "star6") {
-    return "star6";
-  }
-  if (normalized === "star8") {
-    return "star8";
-  }
-  if (normalized === "plus") {
-    return "plus";
-  }
-  if (normalized === "heart") {
-    return "heart";
-  }
-  if (normalized === "cloud") {
-    return "cloud";
-  }
-  if (normalized === "sun") {
-    return "sun";
-  }
-  if (normalized === "moon") {
-    return "moon";
-  }
-  if (normalized === "pie") {
-    return "pie";
-  }
-  if (normalized === "plaque") {
-    return "plaque";
-  }
-  if (normalized === "teardrop") {
-    return "teardrop";
-  }
-  if (normalized === "rtarrow" || normalized === "rightarrow") {
-    return "rtArrow";
-  }
-  if (normalized === "leftarrow") {
-    return "leftArrow";
-  }
-  if (normalized === "uparrow") {
-    return "upArrow";
-  }
-  if (normalized === "downarrow") {
-    return "downArrow";
-  }
-  if (normalized.includes("connector")) {
-    return "connector";
-  }
-  if (normalized === "connector") {
-    return "connector";
-  }
-  return "rect";
-}
-
-// src/viewer/utils/element.ts
-function isConnectorOrLineElement(element) {
-  if (element.type === "connector") {
-    return true;
-  }
-  if (!hasShapeProperties(element)) {
-    return false;
-  }
-  const st = getShapeType(element.shapeType);
-  return st === "connector" || st === "line" || element.shapeType === "line";
-}
-
-// src/viewer/utils/image-style.ts
-function getImageMaskStyle(element) {
-  if (!hasShapeProperties(element)) {
-    return void 0;
-  }
-  const geometry = resolveShapeGeometry(element);
-  if (geometry.kind === "borderRadius") {
-    return { borderRadius: geometry.radius };
-  }
-  return geometry.kind === "clipPath" ? { clipPath: geometry.clipPath } : void 0;
-}
-function getImageRenderStyle(element) {
-  const fit = getImageFitStyle(element);
-  const counterTransform = getImageFillCounterTransform(element, Boolean(fit.transform));
-  return {
-    // A translated/scaled crop, or a rotWithShape=false counter-transform,
-    // must be masked by the stationary wrapper, not by the moving/counter-
-    // transformed bitmap itself.
-    ...fit.transform || counterTransform ? {} : getImageMaskStyle(element) || {},
-    ...fit,
-    ...counterTransform ? { transform: counterTransform, transformOrigin: "center" } : {}
-  };
-}
-function getImageSurfaceMaskStyle(element) {
-  const mask = getImageMaskStyle(element);
-  return {
-    overflow: "hidden",
-    borderRadius: mask?.borderRadius,
-    clipPath: mask?.clipPath ?? getCropShapeClipPath2(element)
-  };
-}
-function getImageSurfaceStyle(element) {
-  const fill = hasShapeProperties(element) ? getComputedFillStyle(element) : void 0;
-  return {
-    position: "absolute",
-    inset: 0,
-    ...getImageSurfaceMaskStyle(element),
-    backgroundColor: fill?.backgroundColor ?? "transparent",
-    backgroundImage: fill?.backgroundImage,
-    backgroundRepeat: fill?.backgroundRepeat,
-    backgroundSize: fill?.backgroundSize,
-    backgroundPosition: fill?.backgroundPosition
-  };
-}
-function getCropShapeClipPath2(element) {
-  if (!isImageLikeElement(element)) {
-    return void 0;
-  }
-  return getCropShapeClipPath(element.cropShape, element.width, element.height);
-}
-function getImageTilingStyle2(element, nativeSize) {
-  return getImageTilingStyle(element, nativeSize);
-}
-
-// src/viewer/utils/geometry-image.ts
-function shouldRenderFallbackLabel(element, isTextElement) {
-  if (isTextElement) {
-    return false;
-  }
-  if (element.type === "shape" || element.type === "connector") {
-    return false;
-  }
-  if (element.type === "picture" || element.type === "image") {
-    return false;
-  }
-  if (element.type === "table") {
-    return false;
-  }
-  if (element.type === "media") {
-    return false;
-  }
-  if (element.type === "contentPart") {
-    return false;
-  }
-  if (element.type === "model3d") {
-    return false;
-  }
-  if (element.type === "ole") {
-    const previewData = element.previewImageData ?? element.previewImage;
-    return !previewData;
-  }
-  return element.type === "chart" || element.type === "smartArt" || element.type === "unknown";
-}
-function ensureArrayValue(value) {
-  if (!value) {
-    return [];
-  }
-  return Array.isArray(value) ? value : [value];
-}
-
-// src/viewer/utils/media-persistent-audio.tsx
-function buildTrimFragment(element) {
-  const start = element.trimStartMs;
-  if (start === void 0 || start <= 0) {
-    return "";
-  }
-  return `#t=${(start / 1e3).toFixed(3)}`;
-}
-function useMediaMetadataExtraction(mediaRef, element) {
-  const [metadata, setMetadata] = useState(element.metadata);
-  useEffect(() => {
-    const el = mediaRef.current;
-    if (!el) {
-      return;
-    }
-    if (element.metadata?.duration !== void 0) {
-      setMetadata(element.metadata);
-      return;
-    }
-    const extract = () => {
-      if (!Number.isFinite(el.duration) || el.duration === 0) {
-        return;
-      }
-      const meta = {
-        duration: el.duration
-      };
-      if (el instanceof HTMLVideoElement) {
-        if (el.videoWidth > 0) {
-          meta.videoWidth = el.videoWidth;
-        }
-        if (el.videoHeight > 0) {
-          meta.videoHeight = el.videoHeight;
-        }
-      }
-      const sourceEl = el.querySelector("source");
-      if (sourceEl?.type) {
-        meta.codecInfo = sourceEl.type;
-      }
-      element.metadata = meta;
-      setMetadata(meta);
-    };
-    el.addEventListener("loadedmetadata", extract);
-    if (el.readyState >= 1) {
-      extract();
-    }
-    return () => {
-      el.removeEventListener("loadedmetadata", extract);
-    };
-  }, [mediaRef, element]);
-  return metadata;
-}
-function CaptionTrackRenderer({
-  captionTracks
-}) {
-  return /* @__PURE__ */ jsx(Fragment, { children: captionTracks.map((track) => {
-    const trackSrc = track.src ?? (track.content ? `data:text/vtt;charset=utf-8,${encodeURIComponent(track.content)}` : void 0);
-    if (!trackSrc) {
-      return null;
-    }
-    return /* @__PURE__ */ jsx(
-      "track",
-      {
-        kind: track.kind,
-        label: track.label,
-        srcLang: track.language,
-        src: trackSrc,
-        default: track.isDefault
-      },
-      track.id
-    );
-  }) });
-}
-function VideoWithMetadata({
-  element,
-  mediaRef,
-  onPlay,
-  dataUrl,
-  trimFragment,
-  mediaMimeType,
-  posterUrl,
-  shouldLoop,
-  shouldAutoPlay,
-  isFullScreen,
-  isPresentationMode,
-  showTransport
-}) {
-  useMediaMetadataExtraction(mediaRef, element);
-  const captionTracks = element.captionTracks ?? [];
-  return /* @__PURE__ */ jsxs(
-    "video",
-    {
-      ref: mediaRef,
-      className: "w-full h-full pointer-events-auto",
-      style: isFullScreen ? { objectFit: "cover" } : getImageFitStyle(element),
-      controls: showTransport,
-      preload: "metadata",
-      playsInline: true,
-      autoPlay: shouldAutoPlay,
-      muted: shouldAutoPlay && !isPresentationMode,
-      poster: posterUrl,
-      loop: shouldLoop,
-      onPlay,
-      crossOrigin: captionTracks.length > 0 ? "anonymous" : void 0,
-      children: [
-        /* @__PURE__ */ jsx("source", { src: `${dataUrl}${trimFragment}`, type: mediaMimeType || "video/mp4" }),
-        captionTracks.length > 0 && /* @__PURE__ */ jsx(CaptionTrackRenderer, { captionTracks })
-      ]
-    }
-  );
-}
-function AudioWithMetadata({
-  element,
-  mediaRef,
-  onPlay,
-  dataUrl,
-  trimFragment,
-  mediaMimeType,
-  shouldLoop,
-  shouldAutoPlay,
-  showTransport
-}) {
-  useMediaMetadataExtraction(mediaRef, element);
-  return /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center p-2 pointer-events-auto", children: /* @__PURE__ */ jsx(
-    "audio",
-    {
-      ref: mediaRef,
-      className: "w-full",
-      controls: showTransport,
-      preload: "metadata",
-      autoPlay: shouldAutoPlay,
-      loop: shouldLoop,
-      onPlay,
-      children: /* @__PURE__ */ jsx("source", { src: `${dataUrl}${trimFragment}`, type: mediaMimeType || "audio/mpeg" })
-    }
-  ) });
-}
-function PresentationMediaController({
-  element,
-  isPresentationMode,
-  shouldAutoPlay,
-  resolvedDataUrl,
-  isFullScreen,
-  onPlayStateChange,
-  children
-}) {
-  const { t } = useTranslation();
-  const mediaRef = useRef(null);
-  const [isMediaPlaying, setIsMediaPlaying] = useState(false);
-  const trimStartSec = element.trimStartMs !== void 0 ? element.trimStartMs / 1e3 : 0;
-  const hideWhenNotPlaying = isPresentationMode && element.hideWhenNotPlaying === true;
-  const { volume: playbackVolume, playbackRate } = mediaPlaybackAttributes({
-    loop: element.loop,
-    volume: element.volume,
-    playbackSpeed: element.playbackSpeed
-  });
-  useEffect(() => {
-    const el = mediaRef.current;
-    if (el) {
-      el.volume = playbackVolume;
-    }
-  }, [playbackVolume]);
-  useEffect(() => {
-    const el = mediaRef.current;
-    if (el) {
-      el.playbackRate = playbackRate;
-    }
-  }, [playbackRate]);
-  useEffect(() => {
-    const el = mediaRef.current;
-    if (!el) {
-      return;
-    }
-    const handlePlay = () => {
-      setIsMediaPlaying(true);
-      onPlayStateChange?.(true);
-    };
-    const handlePause = () => {
-      setIsMediaPlaying(false);
-      onPlayStateChange?.(false);
-    };
-    const handleEnded = () => {
-      setIsMediaPlaying(false);
-      onPlayStateChange?.(false);
-    };
-    el.addEventListener("play", handlePlay);
-    el.addEventListener("pause", handlePause);
-    el.addEventListener("ended", handleEnded);
-    return () => {
-      el.removeEventListener("play", handlePlay);
-      el.removeEventListener("pause", handlePause);
-      el.removeEventListener("ended", handleEnded);
-    };
-  }, [onPlayStateChange]);
-  useEffect(() => {
-    const el = mediaRef.current;
-    if (!el || !isPresentationMode) {
-      return;
-    }
-    return scheduleMediaTrimAndFade(el, {
-      trimStartMs: element.trimStartMs,
-      trimEndMs: element.trimEndMs,
-      fadeInDuration: element.fadeInDuration,
-      fadeOutDuration: element.fadeOutDuration,
-      volume: playbackVolume
-    });
-  }, [
-    isPresentationMode,
-    element.trimStartMs,
-    element.trimEndMs,
-    element.fadeInDuration,
-    element.fadeOutDuration,
-    playbackVolume
-  ]);
-  useEffect(() => {
-    if (!isPresentationMode || !shouldAutoPlay) {
-      return;
-    }
-    if (element.playAcrossSlides && element.mediaType === "audio") {
-      const dataUrl = element.mediaData ?? resolvedDataUrl;
-      if (registerCrossSlideAudio(element, dataUrl)) {
-        return;
-      }
-    }
-    const el = mediaRef.current;
-    if (!el) {
-      return;
-    }
-    const timer = window.setTimeout(() => {
-      if (trimStartSec > 0) {
-        el.currentTime = trimStartSec;
-      }
-      void el.play().catch(() => {
-      });
-    }, 100);
-    return () => window.clearTimeout(timer);
-  }, [isPresentationMode, shouldAutoPlay, element, resolvedDataUrl, trimStartSec]);
-  const wrapperStyle = hideWhenNotPlaying ? {
-    opacity: isMediaPlaying ? 1 : 0,
-    transition: "opacity 0.3s ease",
-    pointerEvents: isMediaPlaying ? "auto" : "none"
-  } : {};
-  const handleStopFullScreen = useCallback(() => {
-    const el = mediaRef.current;
-    if (el && !el.paused) {
-      el.pause();
-    }
-  }, []);
-  const noopOnPlay = useCallback(() => {
-  }, []);
-  return /* @__PURE__ */ jsxs("div", { className: "w-full h-full", style: wrapperStyle, children: [
-    children({ mediaRef, onPlay: noopOnPlay, isMediaPlaying }),
-    shouldShowMediaFullscreenStopButton({
-      fullScreen: isFullScreen,
-      presenting: isPresentationMode,
-      playing: isMediaPlaying
-    }) && /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        className: "absolute bottom-3 right-3 z-30 rounded-full bg-black/50 hover:bg-black/70 text-white/80 hover:text-white p-2 transition-colors pointer-events-auto",
-        onClick: handleStopFullScreen,
-        "aria-label": t("pptx.media.stopFullscreenAria"),
-        children: /* @__PURE__ */ jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "currentColor", stroke: "none", children: /* @__PURE__ */ jsx("rect", { x: "6", y: "6", width: "12", height: "12", rx: "1" }) })
-      }
-    )
-  ] });
-}
-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${visual.dimPoster ? " opacity-50" : ""}`,
-          style: getImageFitStyle(element)
-        }
-      ),
-      /* @__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"] });
-  }
-  const mediaType = element.mediaType;
-  const mediaPath = element.mediaPath;
-  const mediaMimeType = element.mediaMimeType;
-  const dataUrl = element.mediaData ?? (mediaPath ? mediaDataUrls.get(mediaPath) : void 0);
-  const trimFragment = buildTrimFragment(element);
-  const posterUrl = element.posterFrameData ?? void 0;
-  const shouldLoop = mediaPlaybackAttributes(element).loop;
-  const shouldAutoPlay = options?.autoPlay === true || element.autoPlay === true;
-  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) {
-    return renderMediaFallback({ element, posterUrl, surface });
-  }
-  if (mediaType === "video") {
-    const onlineVideo = getOnlineVideoEmbed(element);
-    if (onlineVideo) {
-      return /* @__PURE__ */ jsx(
-        "iframe",
-        {
-          src: onlineVideo.embedUrl,
-          title: translationsEn["pptx.media.onlineVideoTitle"],
-          className: "w-full h-full border-0 pointer-events-auto",
-          allow: ONLINE_VIDEO_IFRAME_ALLOW,
-          allowFullScreen: true,
-          sandbox: ONLINE_VIDEO_IFRAME_SANDBOX
-        }
-      );
-    }
-    if (dataUrl) {
-      return /* @__PURE__ */ jsx(
-        PresentationMediaController,
-        {
-          element,
-          isPresentationMode,
-          shouldAutoPlay,
-          resolvedDataUrl: dataUrl,
-          isFullScreen,
-          onPlayStateChange: options?.onPlayStateChange,
-          children: ({ mediaRef, onPlay }) => /* @__PURE__ */ jsx(
-            VideoWithMetadata,
-            {
-              element,
-              mediaRef,
-              onPlay,
-              dataUrl,
-              trimFragment,
-              mediaMimeType,
-              posterUrl,
-              shouldLoop,
-              shouldAutoPlay,
-              isFullScreen,
-              isPresentationMode,
-              showTransport
-            }
-          )
-        }
-      );
-    }
-    return renderMediaFallback({ element, posterUrl, surface });
-  }
-  if (mediaType === "audio") {
-    if (dataUrl) {
-      return /* @__PURE__ */ jsx(
-        PresentationMediaController,
-        {
-          element,
-          isPresentationMode,
-          shouldAutoPlay,
-          resolvedDataUrl: dataUrl,
-          isFullScreen: false,
-          onPlayStateChange: options?.onPlayStateChange,
-          children: ({ mediaRef, onPlay }) => /* @__PURE__ */ jsx(
-            AudioWithMetadata,
-            {
-              element,
-              mediaRef,
-              onPlay,
-              dataUrl,
-              trimFragment,
-              mediaMimeType,
-              shouldLoop,
-              shouldAutoPlay,
-              showTransport
-            }
-          )
-        }
-      );
-    }
-    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: translationsEn["pptx.media.title"] });
-}
-
-// src/viewer/utils/text-utils.tsx
-function getTextStyleForElement(element, fallbackColor) {
-  return buildTextBlockStyle(element, { fallbackColor });
-}
-
-// src/viewer/utils/text-layout.tsx
-function getTextLayoutStyle(element) {
-  if (!hasTextProperties(element)) {
-    return {};
-  }
-  const writingMode = toCssWritingMode(element.textStyle?.textDirection);
-  const textOrientation = toCssTextOrientation(element.textStyle?.textDirection);
-  const verticalDirection = toCssVerticalDirection(element.textStyle?.textDirection);
-  const textWrapNone = element.textStyle?.textWrap === "none";
-  const shapeAutoFitTextBox = element.textStyle?.autoFitMode === "shrink" && (element.type === "text" || element.locks?.txBox === true);
-  const hasParagraphIndents = hasTextProperties(element) && element.paragraphIndents && element.paragraphIndents.length > 0;
-  const paragraphMarginLeft = element.textStyle?.paragraphMarginLeft;
-  const paragraphIndent = element.textStyle?.paragraphIndent;
-  const marginLeft = !hasParagraphIndents && typeof paragraphMarginLeft === "number" && paragraphMarginLeft !== 0 ? paragraphMarginLeft : void 0;
-  const textIndent = !hasParagraphIndents && typeof paragraphIndent === "number" && paragraphIndent !== 0 ? paragraphIndent : void 0;
-  const bodyTop = element.textStyle?.bodyInsetTop ?? DEFAULT_BODY_INSET_TB_PX;
-  const bodyBottom = element.textStyle?.bodyInsetBottom ?? DEFAULT_BODY_INSET_TB_PX;
-  const bodyLayoutStyle = buildTextBodyLayoutStyle(element);
-  return {
-    ...bodyLayoutStyle,
-    // Body inset only. Paragraph spacing (spcBef/spcAft) is applied
-    // per-paragraph by the paragraph renderer, not collapsed here.
-    paddingTop: bodyTop,
-    paddingBottom: bodyBottom,
-    writingMode,
-    textOrientation,
-    direction: verticalDirection ?? bodyLayoutStyle.direction,
-    marginLeft: marginLeft ?? bodyLayoutStyle.marginLeft,
-    textIndent,
-    ...shapeAutoFitTextBox ? {
-      width: textWrapNone ? "max-content" : "100%",
-      minWidth: "100%",
-      height: "max-content",
-      minHeight: "100%",
-      whiteSpace: "pre-wrap",
-      wordBreak: textWrapNone ? "normal" : "break-word",
-      overflow: "visible"
-    } : {},
-    ...textWrapNone ? {
-      whiteSpace: "nowrap",
-      overflow: "visible"
-    } : {}
-  };
-}
-
-// src/viewer/utils/text-effects.tsx
-function buildTextBody3DSceneStyle2(textStyle, elementSize) {
-  return buildTextBody3DSceneStyle(textStyle, elementSize);
-}
-
-// src/viewer/utils/text-warp-css.tsx
-function getTextWarpStyle(textStyle) {
-  const preset = textStyle?.textWarpPreset;
-  if (!preset || preset === "textNoShape" || preset === "textPlain") {
-    return void 0;
-  }
-  switch (preset) {
-    // Arch shapes
-    case "textArchUp":
-    case "textArchUpPour":
-      return {
-        transform: "perspective(400px) rotateX(-12deg)",
-        transformOrigin: "center bottom"
-      };
-    case "textArchDown":
-    case "textArchDownPour":
-      return {
-        transform: "perspective(400px) rotateX(12deg)",
-        transformOrigin: "center top"
-      };
-    // Button shapes (concave/convex)
-    case "textButton":
-    case "textButtonPour":
-      return {
-        transform: "perspective(500px) rotateX(8deg)",
-        transformOrigin: "center top"
-      };
-    // Chevron / arrow
-    case "textChevron":
-    case "textChevronInverted":
-      return {
-        transform: "perspective(600px) rotateY(6deg)",
-        transformOrigin: "center center"
-      };
-    // Circle
-    case "textCircle":
-    case "textCirclePour":
-      return {
-        transform: "perspective(350px) rotateX(-5deg) rotateY(5deg)",
-        borderRadius: "50%"
-      };
-    // Slant
-    case "textSlantUp":
-      return {
-        transform: "perspective(500px) rotateY(8deg) skewY(-4deg)",
-        transformOrigin: "left center"
-      };
-    case "textSlantDown":
-      return {
-        transform: "perspective(500px) rotateY(-8deg) skewY(4deg)",
-        transformOrigin: "right center"
-      };
-    // Fade
-    case "textFadeUp":
-      return {
-        transform: "perspective(400px) rotateX(-10deg)",
-        transformOrigin: "center bottom"
-      };
-    case "textFadeDown":
-      return {
-        transform: "perspective(400px) rotateX(10deg)",
-        transformOrigin: "center top"
-      };
-    case "textFadeLeft":
-      return {
-        transform: "perspective(400px) rotateY(10deg)",
-        transformOrigin: "right center"
-      };
-    case "textFadeRight":
-      return {
-        transform: "perspective(400px) rotateY(-10deg)",
-        transformOrigin: "left center"
-      };
-    // Inflate / Deflate
-    case "textInflate":
-    case "textInflateBottom":
-    case "textInflateTop":
-      return {
-        transform: "scaleY(1.15) scaleX(1.05)",
-        transformOrigin: "center center"
-      };
-    case "textDeflate":
-    case "textDeflateBottom":
-    case "textDeflateTop":
-      return {
-        transform: "scaleY(0.88) scaleX(0.95)",
-        transformOrigin: "center center"
-      };
-    // Wave
-    case "textWave1":
-    case "textWave2":
-    case "textWave4":
-      return {
-        transform: "perspective(600px) rotateX(-3deg) skewX(3deg)",
-        transformOrigin: "center center"
-      };
-    case "textDoubleWave1":
-      return {
-        transform: "perspective(600px) rotateX(-2deg) skewX(4deg)",
-        transformOrigin: "center center"
-      };
-    // Triangle / Trapezoid
-    case "textTriangle":
-    case "textTriangleInverted":
-      return {
-        transform: "perspective(500px) rotateX(-6deg)",
-        transformOrigin: "center bottom"
-      };
-    // Ring
-    case "textRingInside":
-    case "textRingOutside":
-      return {
-        transform: "perspective(350px) rotateX(-4deg) rotateY(4deg)",
-        transformOrigin: "center center"
-      };
-    // Can
-    case "textCanUp":
-    case "textCanDown":
-      return {
-        transform: "perspective(400px) rotateX(-6deg)",
-        transformOrigin: "center center"
-      };
-    // Cascade
-    case "textCascadeUp":
-      return {
-        transform: "skewY(-8deg)",
-        transformOrigin: "left top"
-      };
-    case "textCascadeDown":
-      return {
-        transform: "skewY(8deg)",
-        transformOrigin: "left top"
-      };
-    // Curve
-    case "textCurveUp":
-      return {
-        transform: "perspective(500px) rotateX(-8deg)",
-        transformOrigin: "center bottom"
-      };
-    case "textCurveDown":
-      return {
-        transform: "perspective(500px) rotateX(8deg)",
-        transformOrigin: "center top"
-      };
-    // Inflate/Deflate compound variants
-    case "textDeflateInflate":
-      return {
-        transform: "scaleY(0.92) scaleX(1.04)",
-        transformOrigin: "center center"
-      };
-    case "textDeflateInflateDeflate":
-      return {
-        transform: "scaleY(0.85) scaleX(1.06)",
-        transformOrigin: "center center"
-      };
-    // Stop / Octagon
-    case "textStop":
-      return {
-        transform: "scaleX(0.9) scaleY(0.9)",
-        transformOrigin: "center center"
-      };
-    default:
-      return void 0;
-  }
-}
-function buildAnimStyle(state) {
-  if (!state) {
-    return void 0;
-  }
-  const style = {};
-  if (state.visible === false) {
-    style.visibility = "hidden";
-  }
-  if (state.cssAnimation) {
-    style.animation = state.cssAnimation;
-  }
-  return Object.keys(style).length > 0 ? style : void 0;
-}
-function wrapWithTextBuildAnimation(elementId, paraIndex, renderedSegments, paraRuns, subElementAnimStates, renderPiece) {
-  if (!subElementAnimStates || subElementAnimStates.size === 0) {
-    return renderedSegments;
-  }
-  const paraKey = `${elementId}${TEXT_BUILD_ID_SEP}p${paraIndex}`;
-  const paraState = subElementAnimStates.get(paraKey);
-  if (paraState) {
-    const style = buildAnimStyle(paraState);
-    return /* @__PURE__ */ jsx("span", { "data-anim-id": paraKey, style: { display: "inline", ...style }, children: renderedSegments }, paraKey);
-  }
-  const spec = buildTextBuildSpec(
-    elementId,
-    paraIndex,
-    paraRuns.map((run) => ({ text: run.text, style: run })),
-    subElementAnimStates
-  );
-  if (!spec?.spans) {
-    return renderedSegments;
-  }
-  return spec.spans.map((span, index) => {
-    const content = span.style && renderPiece ? renderPiece(span.style, span.text, String(index)) : span.text;
-    if (!span.animId) {
-      return /* @__PURE__ */ jsx(React8.Fragment, { children: content }, `ws-${index}`);
-    }
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        "data-anim-id": span.animId,
-        style: textBuildSpanStyle(span),
-        children: content
-      },
-      span.animId
-    );
-  });
-}
-function renderUnderlineWords(text, isUnderlineWords, wordDecoration, metric, keyPrefix, inner) {
-  if (!isUnderlineWords || !text) {
-    return inner(text, keyPrefix, metric);
-  }
-  const pieces = splitWordsForUnderline(text);
-  if (pieces.length === 0) {
-    return inner(text, keyPrefix, metric);
-  }
-  const gapMetric = metric ? {
-    ...metric,
-    nestedStyle: metric.nestedStyle ? stripUnderlineDecoration(metric.nestedStyle) : void 0
-  } : void 0;
-  return pieces.map((piece, i) => {
-    const key = `${keyPrefix}-u${i}`;
-    const following = followingText(pieces, i, metric?.following);
-    if (!piece.underline) {
-      return /* @__PURE__ */ jsx(React8.Fragment, { children: inner(piece.text, key, gapMetric && { ...gapMetric, following }) }, key);
-    }
-    return /* @__PURE__ */ jsx("span", { style: wordDecoration, children: inner(piece.text, key, metric && { ...metric, following }) }, key);
-  });
-}
-function makeSegmentPieceRenderer(needsScriptFonts, scriptFonts, baseFontFamily, isUnderlineWords, wordDecoration, metric) {
-  return (text, key, following) => renderUnderlineWords(
-    text,
-    isUnderlineWords,
-    wordDecoration,
-    metric && { ...metric, following },
-    key,
-    (subText, subKey, subMetric) => renderMetricPieces(
-      subText,
-      subMetric,
-      subKey,
-      (pieceText, pieceKey) => renderScriptAwareText(
-        pieceText,
-        needsScriptFonts,
-        scriptFonts,
-        baseFontFamily,
-        pieceKey,
-        subMetric?.nestedStyle
-      )
-    )
-  );
-}
-function renderTabbedLine(line, ctx, keyPrefix, renderPiece, nestedStyle, underlineWords = false) {
-  const [lineLayout] = buildRunTabLines(
-    line,
-    ctx,
-    nestedStyle,
-    void 0,
-    underlineWords
-  );
-  return /* @__PURE__ */ jsx("span", { style: { display: "inline-block", whiteSpace: "nowrap" }, children: lineLayout.pieces.map((piece, i) => {
-    const key = `${keyPrefix}-tab-${i}`;
-    return /* @__PURE__ */ jsxs(React8.Fragment, { children: [
-      piece.leaderStyle ? /* @__PURE__ */ jsx("span", { "aria-hidden": "true", style: piece.leaderStyle, children: piece.leaderText }) : null,
-      piece.words ? piece.words.map((word, w) => /* @__PURE__ */ jsx("span", { style: word.style, children: renderPiece(word.text, `${key}-w${w}`) }, `${key}-w${w}`)) : /* @__PURE__ */ jsx("span", { style: piece.style, children: renderPiece(piece.text, key) })
-    ] }, key);
-  }) });
-}
-function renderEastAsianPieces(text, metric, keyPrefix, inner, baseStyle, following) {
-  const parts = splitEastAsianBreaks(text, metric.eastAsian, metric.font, following);
-  if (parts.length === 1 && !parts[0].style) {
-    return inner(parts[0].text, keyPrefix);
-  }
-  return parts.map((part, i) => {
-    const key = `${keyPrefix}-e${i}`;
-    return part.style ? /* @__PURE__ */ jsx("span", { style: { ...baseStyle ?? metric.nestedStyle, ...part.style }, children: inner(part.text, key) }, key) : /* @__PURE__ */ jsx(React8.Fragment, { children: inner(part.text, key) }, key);
-  });
-}
-function renderMetricPieces(text, metric, keyPrefix, inner) {
-  if (!metric || !text) {
-    return inner(text, keyPrefix);
-  }
-  const pieces = splitRunForMetrics(text, metric.font);
-  if (pieces.length <= 1) {
-    return renderEastAsianPieces(text, metric, keyPrefix, inner, void 0, metric.following);
-  }
-  return pieces.map((piece, i) => {
-    const key = `${keyPrefix}-w${i}`;
-    const style = {
-      ...metric.nestedStyle,
-      letterSpacing: pieceLetterSpacing(metric.authoredPx, piece.tracking)
-    };
-    return /* @__PURE__ */ jsx("span", { style, children: renderEastAsianPieces(
-      piece.text,
-      metric,
-      key,
-      inner,
-      style,
-      followingText(pieces, i, metric.following)
-    ) }, key);
-  });
-}
-function renderScriptAwareText(text, needsScriptFonts, scriptFonts, baseFontFamily, keyPrefix, nestedStyle) {
-  if (!needsScriptFonts || !text) {
-    return text;
-  }
-  const pieces = splitRunByScriptFont(
-    text,
-    scriptFonts,
-    baseFontFamily,
-    nestedStyle
-  );
-  if (!pieces) {
-    return text;
-  }
-  return pieces.map(
-    (piece, i) => piece.style ? /* @__PURE__ */ jsx("span", { style: piece.style, children: piece.text }, `${keyPrefix}-r${i}`) : /* @__PURE__ */ jsx(React8.Fragment, { children: piece.text }, `${keyPrefix}-r${i}`)
-  );
-}
-function renderSegmentContent(elementId, segmentIndex, textValue, lines, needsScriptFonts, scriptFonts, baseFontFamily, findHighlights, tabContext, metric, isUnderlineWords = false, wordDecoration) {
-  const segHl = findHighlights?.get(segmentIndex);
-  const renderLeaf = makeSegmentPieceRenderer(
-    needsScriptFonts,
-    scriptFonts,
-    baseFontFamily,
-    isUnderlineWords,
-    wordDecoration,
-    metric
-  );
-  if (!segHl || segHl.length === 0) {
-    return lines.map((line, lineIndex) => {
-      const lineKey = `${elementId}-seg-${segmentIndex}-line-${lineIndex}`;
-      return /* @__PURE__ */ jsxs(React8.Fragment, { children: [
-        tabContext && line.includes("	") ? renderTabbedLine(
-          line,
-          tabContext,
-          lineKey,
-          renderLeaf,
-          metric?.nestedStyle,
-          isUnderlineWords
-        ) : renderLeaf(line, lineKey, lineIndex < lines.length - 1 ? "\n" : metric?.following),
-        lineIndex < lines.length - 1 ? /* @__PURE__ */ jsx("br", {}) : null
-      ] }, lineKey);
-    });
-  }
-  const sorted = [...segHl].sort((a, b) => a.startOffset - b.startOffset);
-  const chunks = [];
-  let cursor = 0;
-  for (const hl of sorted) {
-    if (hl.startOffset > cursor) {
-      chunks.push({
-        text: textValue.slice(cursor, hl.startOffset),
-        highlighted: false,
-        isCurrent: false
-      });
-    }
-    chunks.push({
-      text: textValue.slice(hl.startOffset, hl.startOffset + hl.length),
-      highlighted: true,
-      isCurrent: hl.isCurrent
-    });
-    cursor = hl.startOffset + hl.length;
-  }
-  if (cursor < textValue.length) {
-    chunks.push({
-      text: textValue.slice(cursor),
-      highlighted: false,
-      isCurrent: false
-    });
-  }
-  return chunks.map((chunk, ci) => {
-    const chunkKey = `${elementId}-seg-${segmentIndex}-hl-${ci}`;
-    return chunk.highlighted ? /* @__PURE__ */ jsx(
-      "mark",
-      {
-        style: {
-          ...metric?.nestedStyle,
-          backgroundColor: chunk.isCurrent ? "#f97316" : "#facc15",
-          color: "inherit",
-          borderRadius: 2
-        },
-        children: renderLeaf(chunk.text, chunkKey, followingText(chunks, ci, metric?.following))
-      },
-      chunkKey
-    ) : /* @__PURE__ */ jsx(React8.Fragment, { children: renderLeaf(chunk.text, chunkKey, followingText(chunks, ci, metric?.following)) }, chunkKey);
-  });
-}
-function renderEquationSegment(elementId, segmentIndex, equationXml, equationNumber, fontSize) {
-  const mathml = convertOmmlToMathMl(equationXml);
-  const safeMathml = mathml ? sanitizeMathMl(mathml) : "";
-  const equationContent = safeMathml ? /* @__PURE__ */ jsx(
-    "span",
-    {
-      className: "inline-block align-middle",
-      style: {
-        fontFamily: '"Cambria Math", "STIX Two Math", serif'
-      },
-      dangerouslySetInnerHTML: { __html: safeMathml }
-    }
-  ) : /* @__PURE__ */ jsx("span", { className: "inline-block px-1 py-0.5 rounded text-xs bg-gray-200/20 text-gray-400 italic", children: translationsEn["pptx.textSegment.equationFallback"] });
-  if (equationNumber) {
-    return /* @__PURE__ */ jsxs(
-      "span",
-      {
-        style: {
-          display: "flex",
-          justifyContent: "space-between",
-          alignItems: "center",
-          width: "100%",
-          fontSize
-        },
-        children: [
-          /* @__PURE__ */ jsxs("span", { style: { visibility: "hidden", whiteSpace: "nowrap" }, children: [
-            "(",
-            equationNumber,
-            ")"
-          ] }),
-          /* @__PURE__ */ jsx("span", { style: { textAlign: "center", flex: 1 }, children: equationContent }),
-          /* @__PURE__ */ jsxs(
-            "span",
-            {
-              style: {
-                whiteSpace: "nowrap",
-                fontFamily: '"Cambria Math", "STIX Two Math", serif'
-              },
-              children: [
-                "(",
-                equationNumber,
-                ")"
-              ]
-            }
-          )
-        ]
-      },
-      `${elementId}-seg-${segmentIndex}`
-    );
-  }
-  return /* @__PURE__ */ jsx("span", { style: fontSize ? { fontSize } : void 0, children: equationContent }, `${elementId}-seg-${segmentIndex}`);
-}
-function renderHyperlink(run, spanNode, key, ctx) {
-  const url = run.hyperlink?.url;
-  const onHyperlinkClick = ctx.onHyperlinkClick;
-  if (!url || !onHyperlinkClick) {
-    return spanNode;
-  }
-  const requireCtrlClick = ctx.requireCtrlClick;
-  const displayUrl = url.startsWith("ppaction://") ? url.replace(/^ppaction:\/\//u, "").split("?")[0] : url;
-  const targetFrame = run.hyperlink?.target;
-  const follow = (modified) => {
-    if (requireCtrlClick && !modified) {
-      return false;
-    }
-    onHyperlinkClick(url, targetFrame);
-    return true;
-  };
-  return /* @__PURE__ */ jsxs(
-    "span",
-    {
-      role: "link",
-      tabIndex: 0,
-      className: requireCtrlClick ? "group/link relative" : void 0,
-      style: { cursor: requireCtrlClick ? void 0 : "pointer", pointerEvents: "auto" },
-      title: run.hyperlink?.tooltip,
-      onClick: (e) => {
-        if (!follow(e.ctrlKey || e.metaKey)) {
-          return;
-        }
-        e.stopPropagation();
-        e.preventDefault();
-      },
-      onKeyDown: (e) => {
-        if (e.key !== "Enter" && e.key !== " ") {
-          return;
-        }
-        if (!follow(e.ctrlKey || e.metaKey)) {
-          return;
-        }
-        e.preventDefault();
-        e.stopPropagation();
-      },
-      children: [
-        spanNode,
-        requireCtrlClick && /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute left-0 top-full z-[9999] mt-1 max-w-64 opacity-0 transition-opacity duration-150 group-hover/link:opacity-100", children: /* @__PURE__ */ jsxs("span", { className: "flex flex-col rounded border border-border bg-popover px-2.5 py-1.5 shadow-lg", children: [
-          /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-foreground", children: displayUrl }),
-          /* @__PURE__ */ jsx("span", { className: "mt-0.5 text-[10px] text-muted-foreground", children: /* @__PURE__ */ jsx(FollowLinkHint, {}) })
-        ] }) })
-      ]
-    },
-    `${key}-link`
-  );
-}
-function FollowLinkHint() {
-  const { t } = useTranslation();
-  return /* @__PURE__ */ jsx(Fragment, { children: t("pptx.linkTooltip.followLink") });
-}
-function wrapWithTextReflection(run, key, spanNode, spanStyle, baseContent) {
-  if (!run.reflection) {
-    return spanNode;
-  }
-  return /* @__PURE__ */ jsxs("span", { style: { position: "relative", display: "inline-block" }, children: [
-    spanNode,
-    /* @__PURE__ */ jsx(
-      "span",
-      {
-        "aria-hidden": "true",
-        className: "pptx-react-text-reflection",
-        style: run.reflection,
-        children: /* @__PURE__ */ jsx("span", { style: spanStyle, children: baseContent })
-      }
-    )
-  ] }, `${key}-reflwrap`);
-}
-var BASELINE_FONT_SCALE = 0.65;
-function renderParagraphRun(run, segment, ctx, keySuffix = "") {
-  const { element, fallbackColor, findHighlights, onHyperlinkClick } = ctx;
-  const segmentIndex = run.segmentIndex ?? 0;
-  const key = `${element.id}-seg-${segmentIndex}${keySuffix}`;
-  if (run.equation) {
-    return renderEquationSegment(
-      element.id,
-      segmentIndex,
-      run.equation.xml,
-      run.equation.number,
-      typeof run.style.fontSize === "string" ? run.style.fontSize : void 0
-    );
-  }
-  const segmentStyle = segment?.style ?? {};
-  const textValue = run.text;
-  const lines = textValue.split("\n");
-  const resolvedSegmentColor = normalizeHexColor(
-    segmentStyle.color || element.textStyle?.color,
-    run.hyperlink ? HYPERLINK_COLOR : fallbackColor
-  );
-  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 ? BASELINE_FONT_SCALE : 1;
-  const rawFontSize = segmentStyle.fontSize || element.textStyle?.fontSize || DEFAULT_TEXT_FONT_SIZE;
-  const baseFontSize = scaleFontSizeForAutoFit(
-    rawFontSize,
-    resolveAutoFitFontScale(element.textStyle)
-  );
-  const baselineShift = baselineFraction !== 0 ? `${baselineFraction * baseFontSize}px` : void 0;
-  const fontKerning = resolveFontKerning(segmentStyle.kerning, baseFontSize);
-  const scriptFallbackWins = Boolean(
-    segmentStyle.scriptFallbackFont && segmentStyle.fontFamilyIsCascadeDefault
-  );
-  const rawFontFamily = segmentStyle.fontFamily || element.textStyle?.fontFamily;
-  const baseFontFamily = scriptFallbackWins ? getSubstituteFontFamily(segmentStyle.scriptFallbackFont) : rawFontFamily ? getSubstituteFontFamily(
-    rawFontFamily,
-    parsePanoseString(segmentStyle.latinFontPanose ?? element.textStyle?.latinFontPanose)
-  ) : DEFAULT_FONT_FAMILY2;
-  const scriptFonts = resolveScriptFontSet(segmentStyle, element.textStyle, baseFontFamily);
-  const needsScriptFonts = hasDistinctScriptFonts(scriptFonts);
-  const authoredLetterSpacing = authoredLetterSpacingPx(segmentStyle);
-  const metricFont = {
-    fontFamily: baseFontFamily,
-    fontSizePx: baseFontSize * baselineFontScale,
-    bold: Boolean(segmentStyle.bold),
-    italic: Boolean(segmentStyle.italic)
-  };
-  const nestedStyle = nestedTextDecorationStyle(run.style);
-  const metricContext = {
-    font: metricFont,
-    authoredPx: authoredLetterSpacing,
-    nestedStyle,
-    eastAsian: ctx.eastAsianBreaks,
-    following: ctx.eastAsianFollowing
-  };
-  const spanStyle = { ...run.style };
-  spanStyle.color = resolvedSegmentColor;
-  spanStyle.fontSize = baseFontSize * baselineFontScale;
-  spanStyle.fontFamily = baseFontFamily;
-  spanStyle.verticalAlign = baselineShift;
-  spanStyle.fontKerning = fontKerning;
-  spanStyle.letterSpacing = pieceLetterSpacing(
-    authoredLetterSpacing,
-    resolveMetricTrackingPx(textValue, metricFont)
-  );
-  const hollow = hollowTextFillStyle(segmentStyle, {
-    color: resolvedSegmentColor,
-    textStroke: typeof spanStyle.WebkitTextStroke === "string" ? spanStyle.WebkitTextStroke : void 0
-  });
-  if (hollow) {
-    Object.assign(spanStyle, hollow);
-  }
-  const runRtl = segmentStyle.rtl;
-  if (runRtl !== void 0) {
-    spanStyle.direction = runRtl ? "rtl" : "ltr";
-    spanStyle.unicodeBidi = runRtl !== ctx.paragraphRtl ? "bidi-override" : "embed";
-  }
-  const isUnderlineWords = splitsUnderlineIntoWords(segmentStyle);
-  const wordDecoration = isUnderlineWords ? nestedStyle ?? run.underlineWordPieces?.find((piece) => piece.style)?.style : void 0;
-  if (isUnderlineWords) {
-    const stripped = stripUnderlineDecoration(spanStyle);
-    spanStyle.textDecoration = stripped.textDecoration;
-    delete spanStyle.textDecorationStyle;
-    delete spanStyle.textDecorationThickness;
-    delete spanStyle.textUnderlineOffset;
-    delete spanStyle.textDecorationColor;
-  }
-  const baseContent = renderSegmentContent(
-    element.id,
-    segmentIndex,
-    textValue,
-    lines,
-    needsScriptFonts,
-    scriptFonts,
-    baseFontFamily,
-    findHighlights,
-    buildTabContext(
-      element.textStyle?.tabStops,
-      element.textStyle?.defaultTabSize,
-      baseFontSize,
-      baseFontFamily,
-      Boolean(segmentStyle.bold),
-      Boolean(segmentStyle.italic),
-      { language: segmentStyle.language, rtl: ctx.paragraphRtl === true }
-    ),
-    metricContext,
-    isUnderlineWords,
-    wordDecoration
-  );
-  const spanNode = /* @__PURE__ */ jsx("span", { "data-seg-idx": segmentIndex, style: spanStyle, children: renderRubyOrText(run, baseContent) }, key);
-  const reflectedNode = wrapWithTextReflection(run, key, spanNode, spanStyle, baseContent);
-  return run.hyperlink && onHyperlinkClick ? renderHyperlink(run, reflectedNode, key, ctx) : reflectedNode;
-}
-function renderRubyOrText(run, baseContent) {
-  if (!run.ruby) {
-    return baseContent;
-  }
-  return /* @__PURE__ */ jsxs("ruby", { children: [
-    baseContent,
-    /* @__PURE__ */ jsx("rp", { children: "(" }),
-    /* @__PURE__ */ jsx("rt", { style: run.ruby.style, children: run.ruby.text }),
-    /* @__PURE__ */ jsx("rp", { children: ")" })
-  ] });
-}
-function renderSeededListRun(seed, runs, segments, context) {
-  const sourceRun = runs.find((candidate) => candidate.segmentIndex === seed.segmentIndex);
-  const segment = sourceRun ? segments[seed.segmentIndex] : { text: seed.text, style: seed.style };
-  const resolvedSegment = {
-    ...segment,
-    style: withInlineListDecorationDefaults(segment.style, context.element.textStyle)
-  };
-  const decorationCss = segmentStyleToCss(
-    resolvedSegment,
-    resolveAutoFitFontScale(context.element.textStyle)
-  );
-  applyUnderlineVariant(decorationCss, resolvedSegment);
-  const run = sourceRun ? { ...sourceRun, style: { ...sourceRun.style, ...nestedTextDecorationStyle(decorationCss) } } : {
-    text: seed.text,
-    style: decorationCss,
-    segmentIndex: seed.segmentIndex
-  };
-  const rendered = renderParagraphRun(run, resolvedSegment, context);
-  if (!React8.isValidElement(rendered)) {
-    return rendered;
-  }
-  return React8.cloneElement(rendered, {
-    "data-pptx-list-run": seed.token,
-    ...seed.text === "" ? { children: /* @__PURE__ */ jsx("br", {}) } : {}
-  });
-}
-function renderTextSegments(element, fallbackColor, emptyFallback, findHighlights, onHyperlinkClick, fieldContext, subElementAnimStates, segmentOverrides, requireCtrlClick, placeholderPrompt, inlineListSeed) {
-  if (!hasTextProperties(element)) {
-    return emptyFallback || null;
-  }
-  const segments = segmentOverrides ?? element.textSegments;
-  if (!segments || segments.length === 0) {
-    if (placeholderPrompt) {
-      return /* @__PURE__ */ jsx("span", { style: placeholderPrompt.style, children: placeholderPrompt.text });
-    }
-    return element.text || emptyFallback || "";
-  }
-  const paragraphs = buildParagraphs(element, fieldContext, segmentOverrides, {
-    preserveTrailingEmpty: inlineListSeed ? true : void 0,
-    eastAsianRunPieces: false
-  });
-  const ctx = {
-    element,
-    fallbackColor,
-    findHighlights,
-    onHyperlinkClick,
-    requireCtrlClick
-  };
-  return paragraphs.map(
-    (para, paraIndex) => renderParagraph(
-      para,
-      paraIndex,
-      paragraphs.length,
-      segments,
-      ctx,
-      subElementAnimStates,
-      inlineListSeed
-    )
-  );
-}
-function joinRunsBySegment(runs) {
-  const out = [];
-  for (const run of runs) {
-    const last = out[out.length - 1];
-    if (last && run.segmentIndex !== void 0 && last.segmentIndex === run.segmentIndex && !last.equation && !run.equation) {
-      last.text += run.text;
-      continue;
-    }
-    out.push({ ...run });
-  }
-  return out;
-}
-function renderParagraph(para, paraIndex, paraCount, segments, ctx, subElementAnimStates, inlineListSeed) {
-  const element = ctx.element;
-  const runCtx = {
-    ...ctx,
-    paragraphRtl: para.rtl,
-    eastAsianBreaks: para.eastAsianBreaks
-  };
-  const runs = joinRunsBySegment(para.runs);
-  const listParagraph = inlineListSeed?.paragraphs[paraIndex];
-  const renderedRuns = listParagraph ? listParagraph.runs.map((run) => renderSeededListRun(run, runs, segments, runCtx)) : runs.map(
-    (run, i) => renderParagraphRun(run, segments[run.segmentIndex ?? -1], {
-      ...runCtx,
-      eastAsianFollowing: para.eastAsianBreaks ? followingText(runs, i) : void 0
-    })
-  );
-  const paraStyle = {
-    // `text-align`, BiDi `direction` / `unicode-bidi` and the kinsoku
-    // line-break rules, resolved by shared from this paragraph's own `a:pPr`.
-    ...para.paragraphStyle
-  };
-  if (para.strutFontSizePx !== void 0) {
-    paraStyle.fontSize = para.strutFontSizePx;
-  }
-  if (para.spaceBeforePx !== void 0) {
-    paraStyle.marginTop = para.spaceBeforePx;
-  }
-  if (para.spaceAfterPx !== void 0) {
-    paraStyle.marginBottom = para.spaceAfterPx;
-  }
-  if (para.lineHeight !== void 0) {
-    paraStyle.lineHeight = para.lineHeight;
-  }
-  if (para.marginLeftPx !== void 0) {
-    if (para.rtl === true) {
-      paraStyle.marginRight = para.marginLeftPx;
-    } else {
-      paraStyle.marginLeft = para.marginLeftPx;
-    }
-  }
-  if (para.textIndentPx !== void 0) {
-    paraStyle.textIndent = para.textIndentPx;
-  }
-  const marker = renderBulletMarker(para, paraIndex, element.id);
-  const wrappedContent = wrapWithTextBuildAnimation(
-    element.id,
-    paraIndex,
-    renderedRuns,
-    runs,
-    subElementAnimStates,
-    // A staged build splits the paragraph but must not flatten it: each piece
-    // is re-rendered through the SAME run renderer, so it keeps its run's
-    // font, size, colour and decoration while it animates.
-    (run, text, pieceKey) => renderParagraphRun(
-      { ...run, text },
-      segments[run.segmentIndex ?? -1],
-      runCtx,
-      `-build-${pieceKey}`
-    )
-  );
-  const needsWrapper = Boolean(listParagraph) || Object.keys(paraStyle).length > 0 || marker !== null;
-  if (!needsWrapper) {
-    return /* @__PURE__ */ jsxs(React8.Fragment, { children: [
-      wrappedContent,
-      paraIndex < paraCount - 1 ? /* @__PURE__ */ jsx("br", {}) : null
-    ] }, `${element.id}-para-${paraIndex}`);
-  }
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      style: paraStyle,
-      "data-pptx-list-paragraph": listParagraph?.token,
-      children: [
-        marker,
-        para.isEmpty && !listParagraph ? /* @__PURE__ */ jsx("br", {}) : wrappedContent
-      ]
-    },
-    `${element.id}-para-${paraIndex}`
-  );
-}
-function renderBulletMarker(para, paraIndex, elementId) {
-  const picture = para.bulletPicture;
-  if (picture?.src) {
-    return /* @__PURE__ */ jsx(
-      "img",
-      {
-        "data-pptx-bullet-marker": true,
-        contentEditable: false,
-        src: picture.src,
-        alt: picture.accessibleLabel,
-        style: {
-          width: picture.sizePx,
-          height: picture.sizePx,
-          display: "inline-block",
-          verticalAlign: "middle",
-          marginInlineEnd: 4,
-          objectFit: "contain"
-        }
-      },
-      `${elementId}-para-${paraIndex}-bullet-img`
-    );
-  }
-  if (para.bulletMarker === void 0) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      className: "pptx-bullet",
-      "data-pptx-bullet-marker": true,
-      contentEditable: false,
-      style: para.bulletStyle,
-      "aria-label": picture?.accessibleLabel,
-      children: para.bulletMarker
-    },
-    `${elementId}-para-${paraIndex}-bullet`
-  );
-}
-function getDuotoneColors(element) {
-  if (!isImageLikeElement(element)) {
-    return void 0;
-  }
-  return element.imageEffects?.duotone;
-}
-function buildLineShadowCss(element) {
-  if (!hasShapeProperties(element)) {
-    return void 0;
-  }
-  const ss = element.shapeStyle;
-  if (!ss?.lineShadowColor || ss.lineShadowColor === "transparent") {
-    return void 0;
-  }
-  const offsetX = typeof ss.lineShadowOffsetX === "number" ? ss.lineShadowOffsetX : 2;
-  const offsetY = typeof ss.lineShadowOffsetY === "number" ? ss.lineShadowOffsetY : 2;
-  const blur = typeof ss.lineShadowBlur === "number" ? Math.max(0, ss.lineShadowBlur) : 4;
-  const opacity = typeof ss.lineShadowOpacity === "number" ? Math.max(0, Math.min(1, ss.lineShadowOpacity)) : 0.35;
-  return `${Math.round(offsetX)}px ${Math.round(offsetY)}px ${Math.round(blur)}px ${colorWithOpacity(
-    normalizeHexColor(ss.lineShadowColor, "#000000"),
-    opacity
-  )}`;
-}
-function buildLineGlowFilter(element) {
-  if (!hasShapeProperties(element)) {
-    return void 0;
-  }
-  const ss = element.shapeStyle;
-  if (!ss?.lineGlowColor || ss.lineGlowColor === "transparent" || !ss.lineGlowRadius) {
-    return void 0;
-  }
-  const glowOpacity = typeof ss.lineGlowOpacity === "number" ? ss.lineGlowOpacity : 0.75;
-  const glowRad = Math.round(Math.max(0, ss.lineGlowRadius));
-  const glowCol = colorWithOpacity(normalizeHexColor(ss.lineGlowColor, "#ffff00"), glowOpacity);
-  return `drop-shadow(0 0 ${glowRad}px ${glowCol})`;
-}
-function getDagDuotoneFilterId(elementId) {
-  return `dag-duotone-${elementId}`;
-}
-function hasDagDuotoneEffect(element) {
-  if (!hasShapeProperties(element)) {
-    return false;
-  }
-  return Boolean(element.shapeStyle?.dagDuotone);
-}
-function renderDagDuotoneSvgFilter(elementId, color1, color2) {
-  const filterId = getDagDuotoneFilterId(elementId);
-  const c1 = hexToRgbUnit(color1);
-  const c2 = hexToRgbUnit(color2);
-  const grayscaleMatrix = [
-    0.2126,
-    0.7152,
-    0.0722,
-    0,
-    0,
-    0.2126,
-    0.7152,
-    0.0722,
-    0,
-    0,
-    0.2126,
-    0.7152,
-    0.0722,
-    0,
-    0,
-    0,
-    0,
-    0,
-    1,
-    0
-  ].join(" ");
-  return /* @__PURE__ */ jsx(
-    "svg",
-    {
-      width: 0,
-      height: 0,
-      style: { position: "absolute", overflow: "hidden" },
-      "aria-hidden": "true",
-      children: /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("filter", { id: filterId, colorInterpolationFilters: "sRGB", children: [
-        /* @__PURE__ */ jsx("feColorMatrix", { type: "matrix", values: grayscaleMatrix }),
-        /* @__PURE__ */ jsxs("feComponentTransfer", { children: [
-          /* @__PURE__ */ jsx("feFuncR", { type: "linear", slope: c2.r - c1.r, intercept: c1.r }),
-          /* @__PURE__ */ jsx("feFuncG", { type: "linear", slope: c2.g - c1.g, intercept: c1.g }),
-          /* @__PURE__ */ jsx("feFuncB", { type: "linear", slope: c2.b - c1.b, intercept: c1.b })
-        ] })
-      ] }) })
-    }
-  );
-}
-
-// src/viewer/utils/shape-visual-3d.ts
-function build3DExtrusionData2(shape3d, scene3d, fillColor, elementWidth, elementHeight) {
-  return build3DExtrusionData(
-    shape3d,
-    scene3d,
-    fillColor,
-    elementWidth,
-    elementHeight
-  );
-}
-function apply3dEffects2(base, scene3d, shape3d, fillColorFallback, elementSize, elementId) {
-  apply3dEffects(
-    base,
-    scene3d,
-    shape3d,
-    fillColorFallback,
-    elementSize,
-    elementId
-  );
-}
-
-// src/viewer/utils/shape-visual-style.ts
-function rendersCustomVectorPath(element) {
-  return (element.type === "shape" || element.type === "image" || element.type === "picture") && Boolean(element.pathData) && typeof element.pathWidth === "number" && element.pathWidth > 0 && typeof element.pathHeight === "number" && element.pathHeight > 0;
-}
-function rendersWedgeCalloutVector(element) {
-  return element.type === "shape" && isWedgeCalloutPresetShape(element.shapeType);
-}
-function getShapeVisualStyle(element, _hasFill, fillColor, _strokeWidth, _strokeColor, animatesFill, animatesStroke, parentGroupFill) {
-  if (element.type === "group") {
-    const fx2 = getComputedEffectStyle(element);
-    const groupStyle = {};
-    if (fx2.filter) {
-      groupStyle.filter = fx2.filter;
-    }
-    if (fx2.overflowVisible) {
-      groupStyle.overflow = "visible";
-    }
-    return groupStyle;
-  }
-  if (!hasShapeProperties(element)) {
-    return {};
-  }
-  const ss = element.shapeStyle;
-  const fill = animatesFill ? void 0 : getComputedFillStyle(element, parentGroupFill);
-  const fx = getComputedEffectStyle(element);
-  const stroke = getComputedStrokeStyle(element);
-  const base = {
-    // A gradient fill REPLACES the solid fill, it does not sit on top of it;
-    // the whole precedence lives in shared's `getComputedFillStyle`.
-    backgroundColor: fill?.backgroundColor ?? "transparent",
-    backgroundImage: fill?.backgroundImage,
-    backgroundRepeat: fill?.backgroundRepeat,
-    backgroundSize: fill?.backgroundSize,
-    backgroundPosition: fill?.backgroundPosition,
-    // The container always carries `box-sizing: border-box`, so the default
-    // `background-origin: padding-box` would size the paint 2px smaller than
-    // the shape and make a gradient tile wrap, painting a 1px sliver of its
-    // opposite end along the edge. Paint from the border box instead.
-    backgroundOrigin: "border-box",
-    boxShadow: fx.boxShadow,
-    // Reflection is no longer a single CSS property (`-webkit-box-reflect`
-    // never worked in Firefox): `ElementRenderer` renders a mirrored sibling
-    // node instead, using shared's `getReflectionWrapperStyle` directly (see
-    // `ReflectionOverlay`).
-    filter: fx.filter,
-    opacity: fx.opacity,
-    // Only proxy the DAG blend onto the whole element for the blend-only case:
-    // with an overlay colour, `ShapeEffectOverlay` paints a separate blended
-    // tint layer (shared decides which, and returns only one of the two).
-    mixBlendMode: fx.mixBlendMode,
-    // An unstroked element must occupy EXACTLY its authored box, so the
-    // selection/hover affordance is an `outline` (see `ElementRenderer`) and
-    // the border collapses to 0 rather than to a transparent 1px.
-    borderWidth: stroke.borderWidth,
-    borderColor: animatesStroke ? void 0 : stroke.borderColor,
-    borderStyle: stroke.borderStyle,
-    // Inherited SVG presentation properties: written on the container so the
-    // freeform `<path>` and the stroke overlay both pick them up.
-    strokeLinejoin: stroke.strokeLinejoin,
-    strokeMiterlimit: stroke.strokeMiterlimit,
-    strokeLinecap: stroke.strokeLinecap
-  };
-  Object.assign(
-    base,
-    getAnimationColorBaseStyle(element, {
-      animatesFill,
-      animatesStroke,
-      parentGroupFill
-    })
-  );
-  if (element.type === "image" || element.type === "picture") {
-    base.borderWidth = 0;
-    base.borderColor = void 0;
-    base.borderStyle = void 0;
-  }
-  apply3dEffects2(
-    base,
-    ss?.scene3d,
-    ss?.shape3d,
-    ss?.fillColor ?? fillColor,
-    {
-      width: element.width,
-      height: element.height
-    },
-    element.id
-  );
-  if (rendersCustomVectorPath(element) || rendersWedgeCalloutVector(element) || isStrokeOnlyPresetElement(element)) {
-    base.backgroundColor = "transparent";
-    base.backgroundImage = void 0;
-    base.borderWidth = void 0;
-    base.borderColor = void 0;
-    base.borderStyle = void 0;
-  }
-  if (animatesFill) {
-    base.backgroundColor = void 0;
-    base.backgroundImage = void 0;
-  }
-  if (rendersWedgeCalloutVector(element)) {
-    return base;
-  }
-  const geometry = resolveShapeGeometry(element);
-  switch (geometry.kind) {
-    case "bare":
-      return { backgroundColor: "transparent", borderWidth: 0, borderStyle: "none" };
-    case "strokeOnly":
-      return { ...base, backgroundColor: "transparent", backgroundImage: void 0 };
-    case "borderRadius":
-      return { ...base, borderRadius: geometry.radius };
-    case "clipPath":
-      return { ...base, clipPath: geometry.clipPath };
-    case "lineEdge":
-      return {
-        ...base,
-        backgroundColor: "transparent",
-        borderWidth: 0,
-        borderTopWidth: geometry.strokeWidth,
-        borderTopColor: stroke.borderColor,
-        borderTopStyle: stroke.borderStyle ?? "solid"
-      };
-    default:
-      return base;
-  }
-}
-function getConnectorPathGeometry2(element) {
-  return getConnectorPathGeometry(element);
-}
-var ARROW_SIZE_SCALE = {
-  sm: 0.6,
-  med: 1,
-  lg: 1.5
-};
-function renderConnectorMarker(markerId, arrowType, color, arrowWidth, arrowLength) {
-  if (!arrowType || arrowType === "none") {
-    return null;
-  }
-  const wScale = ARROW_SIZE_SCALE[arrowWidth || "med"] ?? 1;
-  const lScale = ARROW_SIZE_SCALE[arrowLength || "med"] ?? 1;
-  const mw = Math.round(8 * lScale);
-  const mh = Math.round(8 * wScale);
-  return /* @__PURE__ */ jsx(
-    "marker",
-    {
-      id: markerId,
-      markerWidth: mw,
-      markerHeight: mh,
-      refX: 8,
-      refY: 5,
-      orient: "auto-start-reverse",
-      viewBox: "0 0 10 10",
-      markerUnits: "strokeWidth",
-      children: arrowType === "triangle" ? /* @__PURE__ */ jsx("polygon", { points: "0,0 10,5 0,10", fill: color }) : arrowType === "stealth" ? /* @__PURE__ */ jsx("polygon", { points: "0,0 10,5 0,10 3.4,5", fill: color }) : arrowType === "diamond" ? /* @__PURE__ */ jsx("polygon", { points: "0,5 5,0 10,5 5,10", fill: color }) : arrowType === "oval" ? /* @__PURE__ */ jsx("ellipse", { cx: 5, cy: 5, rx: 4, ry: 3.3, fill: color }) : /* @__PURE__ */ jsx("path", { d: "M0 0 L10 5 L0 10", fill: "none", stroke: color, strokeWidth: 1.6 })
-    }
-  );
-}
-function renderSvgGradientDefs(gradient) {
-  if (!gradient) {
-    return null;
-  }
-  if (gradient.kind === "rectPath") {
-    return /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("pattern", { id: gradient.id, patternUnits: "objectBoundingBox", width: 1, height: 1, children: /* @__PURE__ */ jsx("image", { href: gradient.href, x: 0, y: 0, width: 1, height: 1, preserveAspectRatio: "none" }) }) });
-  }
-  const stops = gradient.stops.map((stop, index) => /* @__PURE__ */ jsx(
-    "stop",
-    {
-      offset: stop.offset,
-      stopColor: stop.color,
-      stopOpacity: typeof stop.opacity === "number" ? stop.opacity : void 0
-    },
-    index
-  ));
-  return /* @__PURE__ */ jsx("defs", { children: gradient.kind === "radial" ? /* @__PURE__ */ jsx("radialGradient", { id: gradient.id, cx: gradient.cx, cy: gradient.cy, r: gradient.r, children: stops }) : /* @__PURE__ */ jsx(
-    "linearGradient",
-    {
-      id: gradient.id,
-      x1: gradient.x1,
-      y1: gradient.y1,
-      x2: gradient.x2,
-      y2: gradient.y2,
-      children: stops
-    }
-  ) });
-}
-function joinStyle(shapeStyle) {
-  const lineJoin = shapeStyle?.lineJoin === "bevel" ? "bevel" : shapeStyle?.lineJoin === "miter" ? "miter" : "round";
-  const miterLimit = lineJoin === "miter" && typeof shapeStyle?.miterLimit === "number" ? Math.max(shapeStyle.miterLimit / 1e5, 1) : void 0;
-  return { lineJoin, miterLimit };
-}
-function strokeContext(shapeStyle, strokePaint, strokeWidth, dashArray) {
-  const { lineJoin, miterLimit } = joinStyle(shapeStyle);
-  return {
-    strokePaint,
-    strokeWidth,
-    dashArray,
-    lineCap: svgLineCap(shapeStyle?.lineCap),
-    lineJoin,
-    miterLimit,
-    offsets: getCompoundLineOffsets(shapeStyle?.compoundLine, strokeWidth),
-    widths: getCompoundLineWidths(shapeStyle?.compoundLine, strokeWidth)
-  };
-}
-function strokeStrands(d, keyBase, ctx) {
-  return ctx.offsets.map((offset, idx) => /* @__PURE__ */ jsx(
-    "path",
-    {
-      d,
-      fill: "none",
-      stroke: ctx.strokePaint,
-      strokeWidth: Math.max(ctx.widths[idx] ?? ctx.strokeWidth, 1),
-      strokeDasharray: ctx.dashArray,
-      strokeLinecap: ctx.lineCap,
-      strokeLinejoin: ctx.lineJoin,
-      strokeMiterlimit: ctx.miterLimit,
-      vectorEffect: "non-scaling-stroke",
-      style: offset !== 0 ? { transform: `translate(0, ${offset}px)` } : void 0
-    },
-    `${keyBase}-s${idx}`
-  ));
-}
-function renderCustomGeometryVector(pathData, pathWidth, pathHeight, structuredPaths, shapeStyle, hasFill, fillColor, fillOpacity, strokePaint, strokeWidth, dashArray, animatesFill = false, gradient) {
-  const ctx = strokeContext(shapeStyle, strokePaint, strokeWidth, dashArray);
-  const subpaths = structuredPaths && structuredPaths.length > 0 ? customGeometryPathsToSvgSubpaths(structuredPaths, pathWidth, pathHeight) : void 0;
-  const needsPerSubpath = subpaths !== void 0 && subpaths.some((sp) => sp.fillMode && sp.fillMode !== "norm" || sp.stroke === false);
-  const gradientPaint = gradient ? svgGradientFillRef(gradient) : void 0;
-  const nodes = [];
-  if (subpaths && needsPerSubpath) {
-    const paints = buildSubpathPaints(subpaths, hasFill, fillColor, fillOpacity);
-    paints.forEach((paint, idx) => {
-      if (paint.fill !== "none") {
-        const mode = subpaths[idx]?.fillMode;
-        const useGradient = gradientPaint && (mode === void 0 || mode === "norm");
-        nodes.push(
-          /* @__PURE__ */ jsx(
-            "path",
-            {
-              d: paint.d,
-              fill: animatesFill ? "inherit" : useGradient ? gradientPaint : paint.fill,
-              stroke: "none",
-              vectorEffect: "non-scaling-stroke"
-            },
-            `f${idx}`
-          )
-        );
-      }
-      if (paint.stroked && strokeWidth > 0) {
-        nodes.push(...strokeStrands(paint.d, `p${idx}`, ctx));
-      }
-    });
-  } else {
-    if (hasFill) {
-      nodes.push(
-        /* @__PURE__ */ jsx(
-          "path",
-          {
-            d: pathData,
-            fill: animatesFill ? "inherit" : gradientPaint ?? colorWithOpacity(fillColor, fillOpacity),
-            stroke: "none",
-            vectorEffect: "non-scaling-stroke"
-          },
-          "fill"
-        )
-      );
-    }
-    if (strokeWidth > 0) {
-      nodes.push(...strokeStrands(pathData, "agg", ctx));
-    }
-  }
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      viewBox: `0 0 ${pathWidth} ${pathHeight}`,
-      className: "absolute inset-0 w-full h-full pointer-events-none",
-      preserveAspectRatio: "none",
-      children: [
-        animatesFill ? null : renderSvgGradientDefs(gradient),
-        nodes
-      ]
-    }
-  );
-}
-function renderVectorShape(element, hasFill, fillColor, strokeWidth, strokeColor, animatesFill, animatesStroke) {
-  if (!hasShapeProperties(element)) {
-    return null;
-  }
-  const normalizedType = (element.shapeType || "").toLowerCase();
-  const fillPaint = animatesFill ? "inherit" : colorWithOpacity(fillColor, element.shapeStyle?.fillOpacity);
-  const strokePaint = animatesStroke ? "inherit" : colorWithOpacity(strokeColor, element.shapeStyle?.strokeOpacity);
-  const dashType = normalizeStrokeDashType(element.shapeStyle?.strokeDash);
-  const dashArray = getSvgStrokeDasharray(
-    dashType,
-    Math.max(strokeWidth, 1),
-    element.shapeStyle?.customDashSegments
-  );
-  if (normalizedType === "can" || normalizedType === "cylinder") {
-    const width = Math.max(element.width, 1);
-    const height = Math.max(element.height, 1);
-    const rim = Math.max(Math.min(height * 0.16, 28), 6);
-    const stroke = Math.max(strokeWidth, 1);
-    return /* @__PURE__ */ jsxs(
-      "svg",
-      {
-        viewBox: `0 0 ${width} ${height}`,
-        className: "w-full h-full pointer-events-none",
-        preserveAspectRatio: "none",
-        children: [
-          /* @__PURE__ */ jsx(
-            "ellipse",
-            {
-              cx: width / 2,
-              cy: rim / 2,
-              rx: width / 2,
-              ry: rim / 2,
-              fill: hasFill ? fillPaint : "none",
-              stroke: strokeWidth > 0 ? strokePaint : "none",
-              strokeWidth: stroke,
-              strokeDasharray: dashArray,
-              vectorEffect: "non-scaling-stroke"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "rect",
-            {
-              x: 0,
-              y: rim / 2,
-              width,
-              height: Math.max(height - rim, 1),
-              fill: hasFill ? fillPaint : "none",
-              stroke: strokeWidth > 0 ? strokePaint : "none",
-              strokeWidth: stroke,
-              strokeDasharray: dashArray,
-              vectorEffect: "non-scaling-stroke"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "ellipse",
-            {
-              cx: width / 2,
-              cy: height - rim / 2,
-              rx: width / 2,
-              ry: rim / 2,
-              fill: hasFill ? fillPaint : "none",
-              stroke: strokeWidth > 0 ? strokePaint : "none",
-              strokeWidth: stroke,
-              strokeDasharray: dashArray,
-              vectorEffect: "non-scaling-stroke"
-            }
-          )
-        ]
-      }
-    );
-  }
-  if ((element.type === "shape" || element.type === "image" || element.type === "picture") && element.pathData && element.pathWidth && element.pathHeight && element.pathWidth > 0 && element.pathHeight > 0) {
-    return renderCustomGeometryVector(
-      element.pathData,
-      element.pathWidth,
-      element.pathHeight,
-      element.customGeometryPaths,
-      element.shapeStyle,
-      hasFill,
-      fillColor,
-      element.shapeStyle?.fillOpacity,
-      strokePaint,
-      strokeWidth,
-      dashArray,
-      Boolean(animatesFill),
-      // A freeform's `a:gradFill` needs a real SVG paint server: the
-      // container's `background-image` is suppressed for custom geometry, so
-      // without this the shape fell back to the parser's representative solid
-      // and lost every fade (issue #132).
-      buildSvgGradientDef(element.shapeStyle, element.id)
-    );
-  }
-  if ((element.type === "image" || element.type === "picture") && strokeWidth > 0 && !buildStrokeOutline(element)) {
-    const width = Math.max(element.width, 1);
-    const height = Math.max(element.height, 1);
-    const geometry = getPresetShapeVectorGeometry(
-      element.shapeType || "rect",
-      width,
-      height,
-      element.shapeAdjustments
-    );
-    if (geometry) {
-      return /* @__PURE__ */ jsx(
-        "svg",
-        {
-          viewBox: `${geometry.minX} ${geometry.minY} ${geometry.viewWidth} ${geometry.viewHeight}`,
-          className: "w-full h-full pointer-events-none",
-          preserveAspectRatio: "none",
-          children: /* @__PURE__ */ jsx(
-            "path",
-            {
-              d: geometry.d,
-              fill: "none",
-              stroke: strokePaint,
-              strokeWidth: strokeWidth * 2,
-              strokeDasharray: dashArray,
-              vectorEffect: "non-scaling-stroke"
-            }
-          )
-        }
-      );
-    }
-  }
-  if (element.type === "shape" && isWedgeCalloutPresetShape(element.shapeType)) {
-    const width = Math.max(element.width, 1);
-    const height = Math.max(element.height, 1);
-    const geometry = getPresetShapeVectorGeometry(
-      element.shapeType,
-      width,
-      height,
-      element.shapeAdjustments
-    );
-    if (geometry) {
-      const gradient = buildSvgGradientDef(element.shapeStyle, element.id);
-      const gradientPaint = gradient ? svgGradientFillRef(gradient) : void 0;
-      return /* @__PURE__ */ jsxs(
-        "svg",
-        {
-          viewBox: `${geometry.minX} ${geometry.minY} ${geometry.viewWidth} ${geometry.viewHeight}`,
-          className: "pointer-events-none",
-          preserveAspectRatio: "none",
-          style: {
-            position: "absolute",
-            left: geometry.minX,
-            top: geometry.minY,
-            width: geometry.viewWidth,
-            height: geometry.viewHeight,
-            overflow: "visible"
-          },
-          children: [
-            animatesFill ? null : renderSvgGradientDefs(gradient),
-            /* @__PURE__ */ jsx(
-              "path",
-              {
-                d: geometry.d,
-                fill: hasFill ? animatesFill ? "inherit" : gradientPaint ?? fillPaint : "none",
-                stroke: strokeWidth > 0 ? strokePaint : "none",
-                strokeWidth,
-                strokeDasharray: dashArray,
-                vectorEffect: "non-scaling-stroke"
-              }
-            )
-          ]
-        }
-      );
-    }
-  }
-  if (isCalloutShape(normalizedType)) {
-    const width = Math.max(element.width, 1);
-    const height = Math.max(element.height, 1);
-    const geometry = getCalloutLeaderLineGeometry(
-      normalizedType,
-      width,
-      height,
-      element.shapeAdjustments
-    );
-    if (geometry && geometry.points.length >= 2) {
-      const leaderPath = buildCalloutLeaderLineSvgPath(geometry);
-      const bounds = getCalloutViewBoxBounds(width, height, geometry);
-      const lineStroke = Math.max(strokeWidth, 1);
-      const offsetLeft = bounds.minX;
-      const offsetTop = bounds.minY;
-      return /* @__PURE__ */ jsxs(
-        "svg",
-        {
-          viewBox: `${bounds.minX} ${bounds.minY} ${bounds.viewWidth} ${bounds.viewHeight}`,
-          className: "pointer-events-none",
-          preserveAspectRatio: "none",
-          style: {
-            position: "absolute",
-            left: offsetLeft,
-            top: offsetTop,
-            width: bounds.viewWidth,
-            height: bounds.viewHeight,
-            overflow: "visible"
-          },
-          children: [
-            geometry.hasAccent && /* @__PURE__ */ jsx(
-              "line",
-              {
-                x1: 0,
-                y1: 0,
-                x2: width,
-                y2: 0,
-                stroke: strokePaint,
-                strokeWidth: lineStroke,
-                vectorEffect: "non-scaling-stroke"
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "path",
-              {
-                d: leaderPath,
-                fill: "none",
-                stroke: strokePaint,
-                strokeWidth: lineStroke,
-                strokeDasharray: dashArray,
-                strokeLinecap: "round",
-                strokeLinejoin: "round",
-                vectorEffect: "non-scaling-stroke"
-              }
-            )
-          ]
-        }
-      );
-    }
-  }
-  if (element.type === "connector" || getShapeType(element.shapeType) === "connector" || element.shapeType === "line") {
-    const viewWidth = Math.max(element.width, 1);
-    const viewHeight = Math.max(element.height, 1);
-    const { pathData } = getConnectorPathGeometry2(element);
-    const markerSeed = element.id.replace(/[^a-zA-Z0-9_-]/gu, "_");
-    const startMarkerId = `${markerSeed}-start-arrow`;
-    const endMarkerId = `${markerSeed}-end-arrow`;
-    const startArrow = element.shapeStyle?.connectorStartArrow;
-    const endArrow = element.shapeStyle?.connectorEndArrow;
-    const startArrowW = element.shapeStyle?.connectorStartArrowWidth;
-    const startArrowL = element.shapeStyle?.connectorStartArrowLength;
-    const endArrowW = element.shapeStyle?.connectorEndArrowWidth;
-    const endArrowL = element.shapeStyle?.connectorEndArrowLength;
-    const compoundLine = element.shapeStyle?.compoundLine;
-    const connectorLineCap = svgLineCap(element.shapeStyle?.lineCap);
-    const hitTargetWidth = Math.max(strokeWidth * 3, 12);
-    const offsets = getCompoundLineOffsets(compoundLine, strokeWidth);
-    const widths = getCompoundLineWidths(compoundLine, strokeWidth);
-    return /* @__PURE__ */ jsxs(
-      "svg",
-      {
-        viewBox: `0 0 ${viewWidth} ${viewHeight}`,
-        className: "w-full h-full",
-        preserveAspectRatio: "none",
-        style: { overflow: "visible", pointerEvents: "none" },
-        children: [
-          /* @__PURE__ */ jsxs("defs", { children: [
-            renderConnectorMarker(startMarkerId, startArrow, strokePaint, startArrowW, startArrowL),
-            renderConnectorMarker(endMarkerId, endArrow, strokePaint, endArrowW, endArrowL)
-          ] }),
-          /* @__PURE__ */ jsx(
-            "path",
-            {
-              d: pathData,
-              fill: "none",
-              stroke: "transparent",
-              strokeWidth: hitTargetWidth,
-              strokeLinecap: "round",
-              strokeLinejoin: "round",
-              style: { pointerEvents: "stroke" }
-            }
-          ),
-          offsets.map((offset, idx) => /* @__PURE__ */ jsx(
-            "path",
-            {
-              d: pathData,
-              fill: "none",
-              stroke: strokePaint,
-              strokeWidth: Math.max(widths[idx] ?? strokeWidth, 1),
-              strokeDasharray: dashArray,
-              strokeLinecap: connectorLineCap,
-              strokeLinejoin: "round",
-              markerStart: idx === 0 && startArrow && startArrow !== "none" ? `url(#${startMarkerId})` : void 0,
-              markerEnd: idx === offsets.length - 1 && endArrow && endArrow !== "none" ? `url(#${endMarkerId})` : void 0,
-              vectorEffect: "non-scaling-stroke",
-              style: {
-                pointerEvents: "none",
-                ...offset !== 0 ? { transform: `translate(0, ${offset}px)` } : {}
-              }
-            },
-            idx
-          ))
-        ]
-      }
-    );
-  }
-  return null;
-}
-
-// src/viewer/utils/table-cell-fill.tsx
-function parseGradientFillCss(gradFill) {
-  if (!gradFill) {
-    return void 0;
-  }
-  const gsLstRaw = gradFill["a:gsLst"];
-  if (!gsLstRaw) {
-    return void 0;
-  }
-  const stops = ensureArrayValue(gsLstRaw["a:gs"]);
-  if (stops.length === 0) {
-    return void 0;
-  }
-  const rawStops = stops.map((gs) => {
-    const pos = Number.parseInt(String(gs["@_pos"] || "0"), 10) / 1e3;
-    const color = parseDrawingColor(gs) ?? "#888888";
-    const opacity = parseDrawingColorOpacity(gs);
-    return { position: pos, color, opacity };
-  }).sort((a, b) => a.position - b.position);
-  const stopStrings = rawStops.map((s) => `${colorWithOpacity(s.color, s.opacity)} ${s.position.toFixed(1)}%`).join(", ");
-  const lin = gradFill["a:lin"];
-  if (lin) {
-    const angRaw = Number.parseInt(String(lin["@_ang"] || "0"), 10);
-    const angleDeg = Math.round(ooxmlGradientAngleToCssDegrees(angRaw / 6e4));
-    return `linear-gradient(${angleDeg}deg, ${stopStrings})`;
-  }
-  const path = gradFill["a:path"];
-  if (path) {
-    const pathType = String(path["@_path"] || "circle");
-    const fillToRectXml = path["a:fillToRect"];
-    const fillToRect = fillToRectXml ? {
-      l: Number.parseInt(String(fillToRectXml["@_l"] || "0"), 10) / 1e5,
-      t: Number.parseInt(String(fillToRectXml["@_t"] || "0"), 10) / 1e5,
-      r: Number.parseInt(String(fillToRectXml["@_r"] || "0"), 10) / 1e5,
-      b: Number.parseInt(String(fillToRectXml["@_b"] || "0"), 10) / 1e5
-    } : void 0;
-    if (pathType === "rect") {
-      return buildRectPathGradient(rawStops, void 0, fillToRect);
-    }
-    let cx = 50;
-    let cy = 50;
-    if (fillToRect) {
-      const { l, t, r, b } = fillToRect;
-      cx = (l + (1 - r)) / 2 * 100;
-      cy = (t + (1 - b)) / 2 * 100;
-    }
-    const posX = `${Math.round(cx)}%`;
-    const posY = `${Math.round(cy)}%`;
-    if (pathType === "shape") {
-      return `radial-gradient(farthest-side at ${posX} ${posY}, ${stopStrings})`;
-    }
-    return `radial-gradient(circle at ${posX} ${posY}, ${stopStrings})`;
-  }
-  return `linear-gradient(180deg, ${stopStrings})`;
-}
-function parsePatternFillCss(pattFill) {
-  if (!pattFill) {
-    return void 0;
-  }
-  const fgColor = parseDrawingColor(pattFill["a:fgClr"]) ?? "#000000";
-  const bgColor = parseDrawingColor(pattFill["a:bgClr"]) ?? "#ffffff";
-  const preset = String(pattFill["@_prst"] || "ltDnDiag");
-  switch (preset) {
-    case "ltHorz":
-    case "horz":
-    case "narHorz":
-    case "dkHorz":
-    case "wdUpDiag":
-      return `repeating-linear-gradient(0deg, ${bgColor}, ${bgColor} 3px, ${fgColor} 3px, ${fgColor} 4px)`;
-    case "ltVert":
-    case "vert":
-    case "narVert":
-    case "dkVert":
-    case "wdDnDiag":
-      return `repeating-linear-gradient(90deg, ${bgColor}, ${bgColor} 3px, ${fgColor} 3px, ${fgColor} 4px)`;
-    case "ltDnDiag":
-    case "dnDiag":
-    case "dkDnDiag":
-      return `repeating-linear-gradient(135deg, ${bgColor}, ${bgColor} 3px, ${fgColor} 3px, ${fgColor} 4px)`;
-    case "ltUpDiag":
-    case "upDiag":
-    case "dkUpDiag":
-      return `repeating-linear-gradient(45deg, ${bgColor}, ${bgColor} 3px, ${fgColor} 3px, ${fgColor} 4px)`;
-    case "dashHorz":
-    case "dashVert":
-    case "dashDnDiag":
-    case "dashUpDiag":
-      return `repeating-linear-gradient(135deg, ${bgColor}, ${bgColor} 4px, ${fgColor} 4px, ${fgColor} 6px, ${bgColor} 6px, ${bgColor} 10px)`;
-    case "smCheck":
-    case "lgCheck":
-      return `repeating-conic-gradient(${fgColor} 0% 25%, ${bgColor} 0% 50%) 0 0 / 8px 8px`;
-    case "smGrid":
-    case "lgGrid":
-      return `repeating-linear-gradient(0deg, ${fgColor} 0px, ${fgColor} 1px, transparent 1px, transparent 6px), repeating-linear-gradient(90deg, ${fgColor} 0px, ${fgColor} 1px, transparent 1px, transparent 6px), ${bgColor}`;
-    case "dotGrid":
-    case "pct5":
-    case "pct10":
-    case "pct20":
-    case "pct25":
-    case "pct30":
-    case "pct40":
-    case "pct50":
-    case "pct60":
-    case "pct70":
-    case "pct75":
-    case "pct80":
-    case "pct90":
-      return `radial-gradient(${fgColor} 1px, ${bgColor} 1px) 0 0 / 4px 4px`;
-    case "smConfetti":
-    case "lgConfetti":
-    case "zigZag":
-    case "wave":
-    case "sphere":
-    case "divot":
-    case "shingle":
-    case "weave":
-    case "plaid":
-    case "trellis":
-      return `repeating-linear-gradient(45deg, ${bgColor}, ${bgColor} 2px, ${fgColor} 2px, ${fgColor} 3px)`;
-    case "solidDmnd":
-    case "openDmnd":
-      return `repeating-conic-gradient(${fgColor} 0% 25%, ${bgColor} 0% 50%) 0 0 / 10px 10px`;
-    default:
-      return `repeating-linear-gradient(135deg, ${bgColor}, ${bgColor} 3px, ${fgColor} 3px, ${fgColor} 4px)`;
-  }
-}
-function ooxmlDashToCss(dashVal) {
-  if (!dashVal) {
-    return "solid";
-  }
-  switch (dashVal) {
-    case "dot":
-    case "sysDot":
-      return "dotted";
-    case "dash":
-    case "sysDash":
-    case "lgDash":
-      return "dashed";
-    case "dashDot":
-    case "lgDashDot":
-    case "sysDashDot":
-    case "lgDashDotDot":
-    case "sysDashDotDot":
-      return "dashed";
-    case "solid":
-      return "solid";
-    default:
-      return "solid";
-  }
-}
-function parseCellBorders(cellProperties) {
-  if (!cellProperties) {
-    return {};
-  }
-  const borderStyle = {};
-  const edges = [
-    { xml: "a:lnL", prefix: "borderLeft" },
-    { xml: "a:lnR", prefix: "borderRight" },
-    { xml: "a:lnT", prefix: "borderTop" },
-    { xml: "a:lnB", prefix: "borderBottom" }
-  ];
-  for (const edge of edges) {
-    const ln = cellProperties[edge.xml];
-    if (!ln) {
-      continue;
-    }
-    const widthEmu = Number.parseInt(String(ln["@_w"] || "0"), 10);
-    const widthPx = Math.max(1, Math.round(widthEmu / 12700));
-    const prstDash = ln["a:prstDash"];
-    const dashVal = prstDash ? String(prstDash["@_val"] || "") : void 0;
-    const cssBorderStyle = ooxmlDashToCss(dashVal);
-    const color = parseDrawingColor(ln["a:solidFill"]);
-    if (color) {
-      const opacity = parseDrawingColorOpacity(ln["a:solidFill"]);
-      const key = `${edge.prefix}`;
-      borderStyle[key] = `${widthPx}px ${cssBorderStyle} ${colorWithOpacity(color, opacity)}`;
-    }
-  }
-  return borderStyle;
-}
-function parseCellTextEffects(runProps) {
-  const effectLst = runProps?.["a:effectLst"];
-  if (!effectLst) {
-    return void 0;
-  }
-  const textShadowParts = [];
-  const outerShdw = effectLst["a:outerShdw"];
-  if (outerShdw) {
-    const shdwColor = parseDrawingColor(outerShdw);
-    if (shdwColor) {
-      const blurRad = Number.parseInt(String(outerShdw["@_blurRad"] || "0"), 10);
-      const blurPx = blurRad > 0 ? Math.round(blurRad / 12700) : 0;
-      const distVal = Number.parseInt(String(outerShdw["@_dist"] || "0"), 10);
-      const dirVal = Number.parseInt(String(outerShdw["@_dir"] || "0"), 10);
-      let offX = 0;
-      let offY = 0;
-      if (distVal > 0) {
-        const angleRad = dirVal / 6e4 * (Math.PI / 180);
-        offX = Math.round(distVal * Math.cos(angleRad) / 12700);
-        offY = Math.round(distVal * Math.sin(angleRad) / 12700);
-      }
-      textShadowParts.push(`${offX}px ${offY}px ${blurPx}px ${shdwColor}`);
-    }
-  }
-  const glow = effectLst["a:glow"];
-  if (glow) {
-    const glowColor = parseDrawingColor(glow);
-    if (glowColor) {
-      const glowRad = Number.parseInt(String(glow["@_rad"] || "0"), 10);
-      const glowPx = glowRad > 0 ? Math.round(glowRad / 12700) : 2;
-      textShadowParts.push(`0px 0px ${glowPx}px ${glowColor}`);
-    }
-  }
-  return textShadowParts.length > 0 ? textShadowParts.join(", ") : void 0;
-}
-
-// src/viewer/utils/table-cell-style.tsx
-function extractCellText(cellXml) {
-  if (!cellXml) {
-    return "";
-  }
-  const txBody = cellXml["a:txBody"];
-  const paragraphs = ensureArrayValue(txBody?.["a:p"]);
-  const paragraphTexts = [];
-  paragraphs.forEach((paragraph) => {
-    const textParts = [];
-    const runs = ensureArrayValue(paragraph["a:r"]);
-    runs.forEach((run) => {
-      textParts.push(xmlText(run["a:t"]) ?? "");
-    });
-    const fields = ensureArrayValue(paragraph["a:fld"]);
-    fields.forEach((field) => {
-      textParts.push(xmlText(field["a:t"]) ?? "");
-    });
-    paragraphTexts.push(textParts.join(""));
-  });
-  return paragraphTexts.join("\n");
-}
-function parseParagraphAlignment(value) {
-  const alignment = String(value || "").toLowerCase();
-  if (alignment === "ctr") {
-    return "center";
-  }
-  if (alignment === "r") {
-    return "right";
-  }
-  if (alignment === "just" || alignment === "justify") {
-    return "justify";
-  }
-  return "left";
-}
-function extractTableCellStyle(cellXml, fallbackStyle, schemeColorOverrides) {
-  const { color: _fallbackColor, ...fallbackWithoutColor } = fallbackStyle;
-  const cellStyle = { ...fallbackWithoutColor };
-  const txBody = cellXml["a:txBody"];
-  const paragraphs = ensureArrayValue(txBody?.["a:p"]);
-  const firstParagraph = paragraphs[0];
-  const paragraphProperties = firstParagraph?.["a:pPr"];
-  const runs = ensureArrayValue(firstParagraph?.["a:r"]);
-  const firstRun = runs[0];
-  const runProps = firstRun?.["a:rPr"] || paragraphProperties?.["a:defRPr"];
-  if (runProps?.["@_sz"]) {
-    const pointSize = Number.parseInt(String(runProps["@_sz"]), 10) / 100;
-    if (Number.isFinite(pointSize) && pointSize > 0) {
-      cellStyle.fontSize = pointSize * (96 / 72);
-    }
-  }
-  if (runProps?.["@_b"] !== void 0) {
-    cellStyle.fontWeight = runProps["@_b"] === "1" ? 700 : 400;
-  }
-  if (runProps?.["@_i"] !== void 0) {
-    cellStyle.fontStyle = runProps["@_i"] === "1" ? "italic" : "normal";
-  }
-  if (runProps?.["@_u"] !== void 0) {
-    cellStyle.textDecorationLine = runProps["@_u"] === "sng" ? "underline" : "none";
-  }
-  const runColor = parseDrawingColor(runProps?.["a:solidFill"], schemeColorOverrides) || parseDrawingColor(runProps?.["a:highlight"], schemeColorOverrides);
-  if (runColor) {
-    const opacity = parseDrawingColorOpacity(runProps?.["a:solidFill"]);
-    cellStyle.color = colorWithOpacity(runColor, opacity);
-  }
-  const fontFamily = runProps?.["a:latin"]?.["@_typeface"] || runProps?.["a:ea"]?.["@_typeface"] || runProps?.["a:cs"]?.["@_typeface"];
-  if (fontFamily) {
-    cellStyle.fontFamily = fontFamily;
-  }
-  if (paragraphProperties?.["@_algn"]) {
-    cellStyle.textAlign = parseParagraphAlignment(paragraphProperties["@_algn"]);
-  }
-  const cellProperties = cellXml["a:tcPr"];
-  const cellFill = parseDrawingColor(
-    cellProperties?.["a:solidFill"],
-    schemeColorOverrides
-  );
-  if (cellFill) {
-    const opacity = parseDrawingColorOpacity(
-      cellProperties?.["a:solidFill"]
-    );
-    cellStyle.backgroundColor = colorWithOpacity(cellFill, opacity);
-  } else {
-    const gradCss = parseGradientFillCss(cellProperties?.["a:gradFill"]);
-    if (gradCss) {
-      cellStyle.background = gradCss;
-    } else {
-      const pattCss = parsePatternFillCss(cellProperties?.["a:pattFill"]);
-      if (pattCss) {
-        cellStyle.background = pattCss;
-      }
-    }
-  }
-  const edgeBorders = parseCellBorders(cellProperties);
-  Object.assign(cellStyle, edgeBorders);
-  if (!cellStyle.borderLeftColor && !cellStyle.borderRightColor && !cellStyle.borderTopColor && !cellStyle.borderBottomColor) {
-    const borderColor = parseDrawingColor(
-      cellProperties?.["a:lnL"]?.["a:solidFill"],
-      schemeColorOverrides
-    ) || parseDrawingColor(
-      cellProperties?.["a:lnR"]?.["a:solidFill"],
-      schemeColorOverrides
-    ) || parseDrawingColor(
-      cellProperties?.["a:lnT"]?.["a:solidFill"],
-      schemeColorOverrides
-    ) || parseDrawingColor(
-      cellProperties?.["a:lnB"]?.["a:solidFill"],
-      schemeColorOverrides
-    );
-    if (borderColor) {
-      cellStyle.borderColor = borderColor;
-    }
-  }
-  if (cellProperties) {
-    const marL = Number.parseInt(String(cellProperties["@_marL"] || ""), 10);
-    const marR = Number.parseInt(String(cellProperties["@_marR"] || ""), 10);
-    const marT = Number.parseInt(String(cellProperties["@_marT"] || ""), 10);
-    const marB = Number.parseInt(String(cellProperties["@_marB"] || ""), 10);
-    const toPx = (emu) => Math.round(emu / 12700);
-    if (Number.isFinite(marL) && marL > 0) {
-      cellStyle.paddingLeft = toPx(marL);
-    }
-    if (Number.isFinite(marR) && marR > 0) {
-      cellStyle.paddingRight = toPx(marR);
-    }
-    if (Number.isFinite(marT) && marT > 0) {
-      cellStyle.paddingTop = toPx(marT);
-    }
-    if (Number.isFinite(marB) && marB > 0) {
-      cellStyle.paddingBottom = toPx(marB);
-    }
-  }
-  if (cellProperties?.["@_anchor"]) {
-    const anchor = String(cellProperties["@_anchor"]);
-    if (anchor === "ctr") {
-      cellStyle.verticalAlign = "middle";
-    } else if (anchor === "b") {
-      cellStyle.verticalAlign = "bottom";
-    } else {
-      cellStyle.verticalAlign = "top";
-    }
-  }
-  if (cellProperties?.["@_vert"]) {
-    const vert = String(cellProperties["@_vert"]);
-    switch (vert) {
-      case "vert":
-      case "eaVert":
-      case "wordArtVert":
-      case "wordArtVertRtl":
-        cellStyle.writingMode = "vertical-rl";
-        break;
-      case "vert270":
-      case "mongolianVert":
-        cellStyle.writingMode = "vertical-lr";
-        break;
-    }
-    if (vert === "wordArtVert") {
-      cellStyle.textOrientation = "upright";
-    } else if (cellStyle.writingMode) {
-      cellStyle.textOrientation = "mixed";
-    }
-    if (vert === "wordArtVertRtl") {
-      cellStyle.direction = "rtl";
-    }
-  }
-  const textShadow = parseCellTextEffects(runProps);
-  if (textShadow) {
-    cellStyle.textShadow = textShadow;
-  }
-  return cellStyle;
-}
-
-// src/viewer/utils/table-band-style.tsx
-function getTableCellBandStyle2(element, rowIndex, cellIndex, rowCount, columnCount, styleCtx) {
-  if (element.type !== "table") {
-    return void 0;
-  }
-  return getTableCellBandStyle(element.tableData, rowIndex, cellIndex, rowCount, columnCount, {
-    tableStyleMap: styleCtx?.tableStyleMap,
-    colorScheme: styleCtx?.theme?.colorScheme,
-    fontScheme: styleCtx?.theme?.fontScheme
-  });
-}
-
-// src/viewer/utils/table-data-parse.tsx
-function getGraphicDataFromElement(element) {
-  return element.rawXml?.["a:graphic"]?.["a:graphicData"];
-}
-function getTableXmlFromElement(element) {
-  return getGraphicDataFromElement(element)?.["a:tbl"];
-}
-function parseTableElementData(element, fallbackTextStyle) {
-  const table = getTableXmlFromElement(element);
-  if (!table) {
-    return null;
-  }
-  const rows = ensureArrayValue(table["a:tr"]);
-  if (rows.length === 0) {
-    return null;
-  }
-  const tableGrid = table["a:tblGrid"];
-  const gridColumns = ensureArrayValue(
-    tableGrid?.["a:gridCol"]
-  );
-  const columnWidths = gridColumns.map((column) => {
-    const width = Number.parseInt(String(column?.["@_w"] || ""), 10);
-    return Number.isFinite(width) && width > 0 ? width : 0;
-  });
-  const totalColumnWidth = columnWidths.reduce((sum, width) => sum + width, 0);
-  let columnPercentages = totalColumnWidth > 0 ? columnWidths.map((width) => width / totalColumnWidth * 100) : [];
-  const modelWidths = element.type === "table" ? element.tableData?.columnWidths : void 0;
-  if (modelWidths?.length && modelWidths.length === gridColumns.length && modelWidths.every((width) => Number.isFinite(width) && width >= 0) && Math.abs(modelWidths.reduce((sum, width) => sum + width, 0) - 1) <= Number.EPSILON * modelWidths.length * 4) {
-    columnPercentages = modelWidths.map((width) => width * 100);
-  }
-  const cells = [];
-  rows.forEach((row, rowIndex) => {
-    const rowCells = ensureArrayValue(row["a:tc"]);
-    rowCells.forEach((cell, columnIndex) => {
-      cells.push({
-        rowIndex,
-        columnIndex,
-        text: extractCellText(cell),
-        style: extractTableCellStyle(cell, fallbackTextStyle),
-        rawCell: cell
-      });
-    });
-  });
-  const columnCount = Math.max(
-    columnPercentages.length,
-    rows.reduce((maxCount, row) => {
-      const rowCells = ensureArrayValue(row["a:tc"]);
-      return Math.max(maxCount, rowCells.length);
-    }, 0)
-  );
-  return {
-    rowCount: rows.length,
-    columnCount,
-    rows,
-    columnPercentages,
-    cells
-  };
-}
-function renderTableCellContent(cell, fallbackText) {
-  const runs = cell?.textRuns;
-  if (!runs || runs.length === 0) {
-    return fallbackText || "\xA0";
-  }
-  return runs.map((run, index) => {
-    if (run.isParagraphBreak) {
-      return /* @__PURE__ */ jsx("div", { style: { display: "block", height: 0 } }, `p-${index}`);
-    }
-    if (run.isLineBreak) {
-      return /* @__PURE__ */ jsx("br", {}, `br-${index}`);
-    }
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        style: { position: "relative", ...cellRunStyle(run) },
-        children: run.text
-      },
-      `r-${index}`
-    );
-  });
-}
-function getCellDiagonalBorders2(style, tableData, pos, styleCtx) {
-  return getCellDiagonalBorders(style, tableData, pos, {
-    tableStyleMap: styleCtx?.tableStyleMap,
-    colorScheme: styleCtx?.theme?.colorScheme,
-    fontScheme: styleCtx?.theme?.fontScheme
-  });
-}
-function TableCellDiagonalBorders({
-  diag
-}) {
-  const hasDown = Boolean(diag.diagDownColor && diag.diagDownWidth);
-  const hasUp = Boolean(diag.diagUpColor && diag.diagUpWidth);
-  if (!hasDown && !hasUp) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      "aria-hidden": "true",
-      style: {
-        position: "absolute",
-        inset: 0,
-        width: "100%",
-        height: "100%",
-        pointerEvents: "none",
-        overflow: "visible"
-      },
-      children: [
-        hasDown && /* @__PURE__ */ jsx(
-          "line",
-          {
-            x1: "0",
-            y1: "0",
-            x2: "100%",
-            y2: "100%",
-            stroke: diag.diagDownColor,
-            strokeWidth: diag.diagDownWidth
-          }
-        ),
-        hasUp && /* @__PURE__ */ jsx(
-          "line",
-          {
-            x1: "0",
-            y1: "100%",
-            x2: "100%",
-            y2: "0",
-            stroke: diag.diagUpColor,
-            strokeWidth: diag.diagUpWidth
-          }
-        )
-      ]
-    }
-  );
-}
-function TableCellInput({
-  initialText,
-  style,
-  onCommit,
-  onCancel
-}) {
-  const inputRef = useRef(null);
-  const committedRef = useRef(false);
-  const onCommitRef = useRef(onCommit);
-  onCommitRef.current = onCommit;
-  useEffect(() => {
-    const el = inputRef.current;
-    if (el) {
-      el.focus();
-      el.select();
-    }
-  }, []);
-  useEffect(() => {
-    const input = inputRef.current;
-    return () => {
-      if (!committedRef.current && input) {
-        onCommitRef.current(input.value);
-      }
-    };
-  }, []);
-  const doCommit = (text) => {
-    if (committedRef.current) {
-      return;
-    }
-    committedRef.current = true;
-    onCommit(text);
-  };
-  const doCancel = () => {
-    committedRef.current = true;
-    onCancel();
-  };
-  return /* @__PURE__ */ jsx(
-    "input",
-    {
-      ref: inputRef,
-      type: "text",
-      defaultValue: initialText,
-      className: "w-full bg-transparent outline-none",
-      style: {
-        ...style,
-        padding: 0,
-        margin: 0,
-        border: "none"
-      },
-      onPointerDown: (e) => e.stopPropagation(),
-      onMouseDown: (e) => e.stopPropagation(),
-      onClick: (e) => e.stopPropagation(),
-      onDoubleClick: (e) => e.stopPropagation(),
-      onBlur: (e) => doCommit(e.currentTarget.value),
-      onKeyDown: (e) => {
-        e.stopPropagation();
-        if (e.key === "Escape") {
-          e.preventDefault();
-          doCancel();
-        } else if (e.key === "Enter") {
-          e.preventDefault();
-          doCommit(e.currentTarget.value);
-        } else if (e.key === "Tab") {
-          e.preventDefault();
-          doCommit(e.currentTarget.value);
-        }
-      }
-    }
-  );
-}
-function TableResizeOverlay({
-  children,
-  columnWidths,
-  editable,
-  onResizeColumns,
-  onResizeRow
-}) {
-  const containerRef = useRef(null);
-  const [rowBounds, setRowBounds] = useState([]);
-  const dragRef = useRef(null);
-  const colBoundaries = useMemo(() => computeColumnBoundaries(columnWidths), [columnWidths]);
-  const measureRows = useCallback(() => {
-    const container = containerRef.current;
-    if (!container) {
-      return;
-    }
-    const table = container.querySelector("table");
-    if (!table) {
-      return;
-    }
-    const trs = table.querySelectorAll("tbody > tr");
-    const bounds = [];
-    let cumHeight = 0;
-    trs.forEach((tr, i) => {
-      cumHeight += tr.offsetHeight;
-      if (i < trs.length - 1) {
-        bounds.push(cumHeight);
-      }
-    });
-    setRowBounds((prev) => {
-      if (prev.length === bounds.length && prev.every((v, i) => v === bounds[i])) {
-        return prev;
-      }
-      return bounds;
-    });
-  }, []);
-  useLayoutEffect(() => {
-    measureRows();
-  });
-  useEffect(() => {
-    const handleMouseMove = (e) => {
-      const drag = dragRef.current;
-      if (!drag) {
-        return;
-      }
-      e.preventDefault();
-      const delta = drag.type === "col" ? e.clientX - drag.startPos : e.clientY - drag.startPos;
-      drag.handleEl.style.transform = drag.type === "col" ? `translateX(${delta}px)` : `translateY(${delta}px)`;
-    };
-    const handleMouseUp = (e) => {
-      const drag = dragRef.current;
-      if (!drag || !containerRef.current) {
-        return;
-      }
-      const rect = containerRef.current.getBoundingClientRect();
-      if (e.clientX !== drag.startPos && drag.type === "col" && drag.initialWidths && onResizeColumns) {
-        const deltaProp = (e.clientX - drag.startPos) / rect.width;
-        onResizeColumns(computeResizedColumnWidths(drag.initialWidths, drag.index, deltaProp));
-      } else if (e.clientY !== drag.startPos && drag.type === "row" && onResizeRow) {
-        const deltaY = e.clientY - drag.startPos;
-        const newHeight = computeResizedRowHeight(
-          drag.initialRowHeight ?? DEFAULT_ROW_HEIGHT,
-          deltaY
-        );
-        onResizeRow(drag.index, newHeight);
-      }
-      drag.handleEl.style.transform = "";
-      document.body.style.cursor = "";
-      document.body.style.userSelect = "";
-      dragRef.current = null;
-    };
-    document.addEventListener("mousemove", handleMouseMove);
-    document.addEventListener("mouseup", handleMouseUp);
-    return () => {
-      document.removeEventListener("mousemove", handleMouseMove);
-      document.removeEventListener("mouseup", handleMouseUp);
-    };
-  }, [onResizeColumns, onResizeRow]);
-  if (!editable) {
-    return children;
-  }
-  const startColDrag = (e, index) => {
-    e.preventDefault();
-    e.stopPropagation();
-    document.body.style.cursor = "col-resize";
-    document.body.style.userSelect = "none";
-    dragRef.current = {
-      type: "col",
-      index,
-      startPos: e.clientX,
-      handleEl: e.currentTarget,
-      initialWidths: [...columnWidths]
-    };
-  };
-  const startRowDrag = (e, index) => {
-    e.preventDefault();
-    e.stopPropagation();
-    const table = containerRef.current?.querySelector("table");
-    const tr = table?.querySelectorAll("tbody > tr")[index];
-    const actualHeight = tr?.offsetHeight ?? DEFAULT_ROW_HEIGHT;
-    document.body.style.cursor = "row-resize";
-    document.body.style.userSelect = "none";
-    dragRef.current = {
-      type: "row",
-      index,
-      startPos: e.clientY,
-      handleEl: e.currentTarget,
-      initialRowHeight: actualHeight
-    };
-  };
-  return /* @__PURE__ */ jsxs("div", { ref: containerRef, className: "relative w-full h-full", children: [
-    children,
-    colBoundaries.map((leftPct, i) => /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: "absolute top-0 bottom-0 w-[6px] cursor-col-resize z-10 pointer-events-auto group",
-        style: { left: `calc(${leftPct}% - 3px)` },
-        onMouseDown: (e) => startColDrag(e, i),
-        children: /* @__PURE__ */ jsx("div", { className: "w-px h-full mx-auto bg-transparent group-hover:bg-blue-400/60 transition-colors" })
-      },
-      `col-h-${i}`
-    )),
-    rowBounds.map((topPx, i) => /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: "absolute left-0 right-0 h-[6px] cursor-row-resize z-10 pointer-events-auto group",
-        style: { top: `${topPx - 3}px` },
-        onMouseDown: (e) => startRowDrag(e, i),
-        children: /* @__PURE__ */ jsx("div", { className: "h-px w-full my-auto bg-transparent group-hover:bg-blue-400/60 transition-colors" })
-      },
-      `row-h-${i}`
-    ))
-  ] });
-}
-function renderTableFromTableData(element, textStyle, options) {
-  const tableData = element.tableData;
-  const rowCount = tableData.rows.length;
-  const columnCount = tableData.columnWidths.length;
-  const selectedCell = options?.selectedCell || null;
-  const isEditable = Boolean(options?.editable) && canDrillDown(element);
-  const hasCellSelectionHandler = typeof options?.onSelectCell === "function";
-  const sharedCtx = {
-    tableStyleMap: options?.styleCtx?.tableStyleMap,
-    colorScheme: options?.styleCtx?.theme?.colorScheme,
-    fontScheme: options?.styleCtx?.theme?.fontScheme
-  };
-  const cellCss = (cell, rowIndex, cellIndex) => tableCellCss(
-    tableData,
-    cell,
-    { rowIndex, cellIndex, rowCount, columnCount },
-    sharedCtx,
-    textStyle
-  );
-  const selectionRect = (() => {
-    if (!selectedCell?.selectedCells || selectedCell.selectedCells.length < 2) {
-      return void 0;
-    }
-    const first = selectedCell.selectedCells[0];
-    const last = selectedCell.selectedCells[selectedCell.selectedCells.length - 1];
-    return computeSelectionRect(first.row, first.col, last.row, last.col, tableData);
-  })();
-  return /* @__PURE__ */ jsx(
-    TableResizeOverlay,
-    {
-      columnWidths: tableData.columnWidths,
-      editable: isEditable,
-      onResizeColumns: options?.onResizeColumns,
-      onResizeRow: options?.onResizeRow,
-      children: /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: cn(
-            "w-full h-full overflow-hidden",
-            isEditable && hasCellSelectionHandler ? "pointer-events-auto" : "pointer-events-none"
-          ),
-          children: /* @__PURE__ */ jsxs(
-            "table",
-            {
-              className: "w-full h-full border-collapse table-fixed",
-              style: {
-                fontFamily: DEFAULT_FONT_FAMILY,
-                // `a:tblPr@rtl` mirrors the column order for RTL decks.
-                ...tableContainerCss(tableData)
-              },
-              children: [
-                tableData.columnWidths.length > 0 && /* @__PURE__ */ jsx("colgroup", { children: tableData.columnWidths.map((w, ci) => /* @__PURE__ */ jsx(
-                  "col",
-                  {
-                    style: { width: `${(w * 100).toFixed(2)}%` }
-                  },
-                  `${element.id}-col-${ci}`
-                )) }),
-                /* @__PURE__ */ jsx("tbody", { children: tableData.rows.map((row, rowIndex) => /* @__PURE__ */ jsx(
-                  "tr",
-                  {
-                    style: row.height ? { height: row.height } : void 0,
-                    children: row.cells.map((cell, cellIndex) => {
-                      if (cell.hMerge || cell.vMerge) {
-                        return null;
-                      }
-                      const isCellSelected = selectedCell?.rowIndex === rowIndex && selectedCell?.columnIndex === cellIndex;
-                      const isInMultiSelection = isCellInRect(rowIndex, cellIndex, selectionRect);
-                      const isCellEditing = isCellSelected && selectedCell?.isEditing;
-                      const diag = getCellDiagonalBorders2(
-                        cell.style,
-                        tableData,
-                        { rowIndex, cellIndex, rowCount, columnCount },
-                        options?.styleCtx
-                      );
-                      return /* @__PURE__ */ jsxs(
-                        "td",
-                        {
-                          className: cn(
-                            "px-1 py-0.5 align-top",
-                            // No border of its own: a side the deck gives no border renders with
-                            // none, as PowerPoint does. Editing keeps a faint grid.
-                            isEditable && hasCellSelectionHandler ? "border border-blue-200/70 cursor-cell" : null,
-                            isCellSelected ? "ring-1 ring-inset ring-blue-500" : null,
-                            isInMultiSelection && !isCellSelected ? "bg-blue-500/15 ring-1 ring-inset ring-blue-400/50" : null
-                          ),
-                          colSpan: cell.gridSpan && cell.gridSpan > 1 ? cell.gridSpan : void 0,
-                          rowSpan: cell.rowSpan && cell.rowSpan > 1 ? cell.rowSpan : void 0,
-                          style: {
-                            ...cellCss(cell, rowIndex, cellIndex),
-                            ...diag ? { position: "relative" } : void 0
-                          },
-                          onClick: (event) => {
-                            if (!isEditable || !hasCellSelectionHandler) {
-                              return;
-                            }
-                            event.stopPropagation();
-                            if (event.shiftKey && selectedCell) {
-                              const rect = computeSelectionRect(
-                                selectedCell.rowIndex,
-                                selectedCell.columnIndex,
-                                rowIndex,
-                                cellIndex,
-                                tableData
-                              );
-                              options?.onSelectCell?.({
-                                rowIndex: selectedCell.rowIndex,
-                                columnIndex: selectedCell.columnIndex,
-                                selectedCells: rectToCells(rect)
-                              });
-                            } else {
-                              options?.onSelectCell?.({
-                                rowIndex,
-                                columnIndex: cellIndex
-                              });
-                            }
-                          },
-                          onDoubleClick: (event) => {
-                            if (!isEditable || !hasCellSelectionHandler) {
-                              return;
-                            }
-                            event.stopPropagation();
-                            options?.onSelectCell?.({
-                              rowIndex,
-                              columnIndex: cellIndex,
-                              isEditing: true
-                            });
-                          },
-                          children: [
-                            diag ? /* @__PURE__ */ jsx(TableCellDiagonalBorders, { diag }) : null,
-                            isCellEditing ? /* @__PURE__ */ jsx(
-                              TableCellInput,
-                              {
-                                initialText: cell.text ?? "",
-                                style: cellCss(cell, rowIndex, cellIndex),
-                                onCommit: (text) => {
-                                  options?.onCommitCellEdit?.(rowIndex, cellIndex, text);
-                                },
-                                onCancel: () => {
-                                  options?.onSelectCell?.({
-                                    rowIndex,
-                                    columnIndex: cellIndex
-                                  });
-                                }
-                              }
-                            ) : renderTableCellContent(cell, cell.text || "\xA0")
-                          ]
-                        },
-                        `${element.id}-cell-${rowIndex}-${cellIndex}`
-                      );
-                    })
-                  },
-                  `${element.id}-row-${rowIndex}`
-                )) })
-              ]
-            }
-          )
-        }
-      )
-    }
-  );
-}
-function renderTableElement(element, textStyle, options) {
-  const parsedTable = parseTableElementData(element, textStyle);
-  if (!parsedTable) {
-    const tableEl2 = element;
-    if (tableEl2.tableData && tableEl2.tableData.rows.length > 0) {
-      return renderTableFromTableData(tableEl2, textStyle, options);
-    }
-    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.table.title"] });
-  }
-  const selectedCell = options?.selectedCell || null;
-  const isEditable = Boolean(options?.editable) && canDrillDown(element);
-  const hasCellSelectionHandler = typeof options?.onSelectCell === "function";
-  const tableEl = element;
-  const xmlSelectionRect = (() => {
-    if (!selectedCell?.selectedCells || selectedCell.selectedCells.length < 2) {
-      return void 0;
-    }
-    if (!tableEl.tableData) {
-      return void 0;
-    }
-    const first = selectedCell.selectedCells[0];
-    const last = selectedCell.selectedCells[selectedCell.selectedCells.length - 1];
-    return computeSelectionRect(first.row, first.col, last.row, last.col, tableEl.tableData);
-  })();
-  const schemeOverrides = options?.styleCtx?.theme?.colorScheme ? options.styleCtx.theme.colorScheme : void 0;
-  return /* @__PURE__ */ jsx(
-    TableResizeOverlay,
-    {
-      columnWidths: parsedTable.columnPercentages.map((p) => p / 100),
-      editable: isEditable,
-      onResizeColumns: options?.onResizeColumns,
-      onResizeRow: options?.onResizeRow,
-      children: /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: cn(
-            "w-full h-full overflow-hidden",
-            isEditable && hasCellSelectionHandler ? "pointer-events-auto" : "pointer-events-none"
-          ),
-          children: /* @__PURE__ */ jsxs(
-            "table",
-            {
-              className: "w-full h-full border-collapse table-fixed",
-              style: {
-                fontFamily: DEFAULT_FONT_FAMILY,
-                // `a:tblPr@rtl` mirrors the column order for RTL decks.
-                ...tableContainerCss(tableEl.tableData)
-              },
-              children: [
-                parsedTable.columnPercentages.length > 0 ? /* @__PURE__ */ jsx("colgroup", { children: parsedTable.columnPercentages.map((percentage, columnIndex) => /* @__PURE__ */ jsx(
-                  "col",
-                  {
-                    style: { width: `${percentage.toFixed(2)}%` }
-                  },
-                  `${element.id}-col-${columnIndex}`
-                )) }) : null,
-                /* @__PURE__ */ jsx("tbody", { children: parsedTable.rows.map((row, rowIndex) => {
-                  const cells = ensureArrayValue(row["a:tc"]);
-                  const rowHeightRaw = Number.parseInt(String(row["@_h"] || ""), 10);
-                  const rowHeight = Number.isFinite(rowHeightRaw) && rowHeightRaw > 0 ? Math.max(16, rowHeightRaw / EMU_PER_PX) : void 0;
-                  return /* @__PURE__ */ jsx(
-                    "tr",
-                    {
-                      style: rowHeight ? { height: rowHeight } : void 0,
-                      children: cells.map((cell, cellIndex) => {
-                        const isHMerged = cell["@_hMerge"] === "1";
-                        const isVMerged = cell["@_vMerge"] === "1";
-                        if (isHMerged || isVMerged) {
-                          return null;
-                        }
-                        const gridSpanRaw = Number.parseInt(String(cell["@_gridSpan"] || ""), 10);
-                        const colSpan = Number.isFinite(gridSpanRaw) && gridSpanRaw > 1 ? gridSpanRaw : void 0;
-                        const rowSpanRaw = Number.parseInt(String(cell["@_rowSpan"] || ""), 10);
-                        const rSpan = Number.isFinite(rowSpanRaw) && rowSpanRaw > 1 ? rowSpanRaw : void 0;
-                        const bandStyle = getTableCellBandStyle2(
-                          element,
-                          rowIndex,
-                          cellIndex,
-                          parsedTable.rowCount,
-                          parsedTable.columnCount,
-                          options?.styleCtx
-                        );
-                        const xmlCellStyle = extractTableCellStyle(cell, textStyle, schemeOverrides);
-                        const tdCellOverride = tableEl.tableData?.rows[rowIndex]?.cells[cellIndex]?.style;
-                        const diag = getCellDiagonalBorders2(
-                          tdCellOverride,
-                          tableEl.tableData,
-                          {
-                            rowIndex,
-                            cellIndex,
-                            rowCount: parsedTable.rowCount,
-                            columnCount: parsedTable.columnCount
-                          },
-                          options?.styleCtx
-                        );
-                        const mergedStyle = {
-                          // Lowest-priority fallback: `xmlCellStyle` never carries a
-                          // `color` of its own (see `extractTableCellStyle`), so this
-                          // is the only source when neither the table style band nor
-                          // an explicit run/cell colour applies.
-                          color: textStyle.color,
-                          ...bandStyle,
-                          ...xmlCellStyle,
-                          ...tdCellOverride ? cellStyleToCss(tdCellOverride) : void 0,
-                          ...diag ? { position: "relative" } : void 0
-                        };
-                        return /* @__PURE__ */ jsxs(
-                          "td",
-                          {
-                            className: cn(
-                              "px-1 py-0.5 align-top",
-                              // No border of its own: a side the deck gives no border renders
-                              // with none, as PowerPoint does. Editing keeps a faint grid.
-                              isEditable && hasCellSelectionHandler ? "border border-blue-200/70 cursor-cell" : null,
-                              selectedCell?.rowIndex === rowIndex && selectedCell?.columnIndex === cellIndex ? "ring-1 ring-inset ring-blue-500" : null,
-                              isCellInRect(rowIndex, cellIndex, xmlSelectionRect) && !(selectedCell?.rowIndex === rowIndex && selectedCell?.columnIndex === cellIndex) ? "bg-blue-500/15 ring-1 ring-inset ring-blue-400/50" : null
-                            ),
-                            colSpan,
-                            rowSpan: rSpan,
-                            style: mergedStyle,
-                            onClick: (event) => {
-                              if (!isEditable || !hasCellSelectionHandler) {
-                                return;
-                              }
-                              event.stopPropagation();
-                              if (event.shiftKey && selectedCell && tableEl.tableData) {
-                                const rect = computeSelectionRect(
-                                  selectedCell.rowIndex,
-                                  selectedCell.columnIndex,
-                                  rowIndex,
-                                  cellIndex,
-                                  tableEl.tableData
-                                );
-                                options?.onSelectCell?.({
-                                  rowIndex: selectedCell.rowIndex,
-                                  columnIndex: selectedCell.columnIndex,
-                                  selectedCells: rectToCells(rect)
-                                });
-                              } else {
-                                options?.onSelectCell?.({
-                                  rowIndex,
-                                  columnIndex: cellIndex
-                                });
-                              }
-                            },
-                            onDoubleClick: (event) => {
-                              if (!isEditable || !hasCellSelectionHandler) {
-                                return;
-                              }
-                              event.stopPropagation();
-                              options?.onSelectCell?.({
-                                rowIndex,
-                                columnIndex: cellIndex,
-                                isEditing: true
-                              });
-                            },
-                            children: [
-                              diag ? /* @__PURE__ */ jsx(TableCellDiagonalBorders, { diag }) : null,
-                              selectedCell?.rowIndex === rowIndex && selectedCell?.columnIndex === cellIndex && selectedCell?.isEditing ? /* @__PURE__ */ jsx(
-                                TableCellInput,
-                                {
-                                  initialText: extractCellText(cell) ?? "",
-                                  style: mergedStyle,
-                                  onCommit: (text) => {
-                                    options?.onCommitCellEdit?.(rowIndex, cellIndex, text);
-                                  },
-                                  onCancel: () => {
-                                    options?.onSelectCell?.({
-                                      rowIndex,
-                                      columnIndex: cellIndex
-                                    });
-                                  }
-                                }
-                              ) : renderTableCellContent(
-                                tableEl.tableData?.rows[rowIndex]?.cells[cellIndex],
-                                extractCellText(cell) || "\xA0"
-                              )
-                            ]
-                          },
-                          `${element.id}-cell-${rowIndex}-${cellIndex}`
-                        );
-                      })
-                    },
-                    `${element.id}-row-${rowIndex}`
-                  );
-                }) })
-              ]
-            }
-          )
-        }
-      )
-    }
-  );
-}
-function renderGradientStops(stops) {
-  return stops.map((stop, i) => /* @__PURE__ */ jsx("stop", { offset: stop.offset, stopColor: stop.color, stopOpacity: stop.opacity }, i));
-}
-function partAttrs(part) {
-  return part ? chartPartToAttrs(part) : void 0;
-}
-function resolveReactPalette(chartData) {
-  if (chartData.colorPalette && chartData.colorPalette.length > 0) {
-    return chartData.colorPalette;
-  }
-  return [...getChartStylePalette(chartData.style?.styleId)];
-}
-function buildReactChartViewModel(element) {
-  if (element.type !== "chart" || !element.chartData) {
-    return buildChartViewModel(element);
-  }
-  const palette = resolveReactPalette(element.chartData), themedElement = {
-    ...element,
-    chartData: { ...element.chartData, colorPalette: palette }
-  };
-  return buildChartViewModel(themedElement);
-}
-function renderPrimitive(prim, key) {
-  switch (prim.kind) {
-    case "rect": {
-      const r = prim;
-      return /* @__PURE__ */ jsx(
-        "rect",
-        {
-          x: r.x,
-          y: r.y,
-          width: r.w,
-          height: r.h,
-          fill: r.fill,
-          rx: r.rx ?? 0,
-          opacity: r.opacity ?? 1,
-          ...partAttrs(r.part),
-          children: r.title !== void 0 ? /* @__PURE__ */ jsx("title", { children: r.title }) : null
-        },
-        key
-      );
-    }
-    case "path": {
-      const p = prim;
-      return /* @__PURE__ */ jsx(
-        "path",
-        {
-          d: p.d,
-          fill: p.fill,
-          stroke: p.stroke ?? "none",
-          strokeWidth: p.strokeWidth ?? 0,
-          strokeDasharray: p.dashArray,
-          fillOpacity: p.opacity ?? 1,
-          ...partAttrs(p.part),
-          children: p.title !== void 0 ? /* @__PURE__ */ jsx("title", { children: p.title }) : null
-        },
-        key
-      );
-    }
-    case "polyline": {
-      const p = prim;
-      return /* @__PURE__ */ jsx(
-        "polyline",
-        {
-          points: p.points,
-          stroke: p.stroke,
-          strokeWidth: p.strokeWidth,
-          fill: p.fill,
-          opacity: p.opacity ?? 1,
-          ...partAttrs(p.part),
-          children: p.title !== void 0 ? /* @__PURE__ */ jsx("title", { children: p.title }) : null
-        },
-        key
-      );
-    }
-    case "circle": {
-      const c = prim;
-      return /* @__PURE__ */ jsx(
-        "circle",
-        {
-          cx: c.cx,
-          cy: c.cy,
-          r: c.r,
-          fill: c.fill,
-          opacity: c.opacity ?? 1,
-          ...partAttrs(c.part),
-          children: c.title !== void 0 ? /* @__PURE__ */ jsx("title", { children: c.title }) : null
-        },
-        key
-      );
-    }
-    case "line": {
-      const l = prim;
-      return /* @__PURE__ */ jsx(
-        "line",
-        {
-          x1: l.x1,
-          y1: l.y1,
-          x2: l.x2,
-          y2: l.y2,
-          stroke: l.stroke,
-          strokeWidth: l.strokeWidth,
-          strokeDasharray: l.dashArray,
-          opacity: l.opacity ?? 1,
-          transform: l.transform,
-          children: l.title !== void 0 ? /* @__PURE__ */ jsx("title", { children: l.title }) : null
-        },
-        key
-      );
-    }
-    case "polygon": {
-      const p = prim;
-      return /* @__PURE__ */ jsx(
-        "polygon",
-        {
-          points: p.points,
-          fill: p.fill,
-          stroke: p.stroke,
-          strokeWidth: p.strokeWidth,
-          opacity: p.opacity ?? 1,
-          strokeDasharray: p.dashArray,
-          transform: p.transform,
-          ...partAttrs(p.part),
-          children: p.title !== void 0 ? /* @__PURE__ */ jsx("title", { children: p.title }) : null
-        },
-        key
-      );
-    }
-    case "text": {
-      const t = prim;
-      return /* @__PURE__ */ jsx(
-        "text",
-        {
-          x: t.x,
-          y: t.y,
-          textAnchor: t.textAnchor,
-          fontSize: t.fontSize,
-          fill: t.fill,
-          fontWeight: t.fontWeight ?? "normal",
-          dominantBaseline: t.dominantBaseline,
-          opacity: t.opacity ?? 1,
-          transform: t.transform,
-          children: t.text
-        },
-        key
-      );
-    }
-    default:
-      return null;
-  }
-}
-function renderText(t, key) {
-  return /* @__PURE__ */ jsx(
-    "text",
-    {
-      x: t.x,
-      y: t.y,
-      textAnchor: t.textAnchor,
-      fontSize: t.fontSize,
-      fill: t.fill,
-      fontWeight: t.fontWeight ?? "normal",
-      fontStyle: t.fontStyle ?? "normal",
-      fontFamily: t.fontFamily,
-      dominantBaseline: t.dominantBaseline,
-      opacity: t.opacity ?? 1,
-      transform: t.transform,
-      children: t.text
-    },
-    key
-  );
-}
-function renderChartViewModel(elementId, vm, preserveAspectRatio = "none") {
-  const legendItems = computeChartLegendLayout(vm);
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      className: "w-full h-full pointer-events-none",
-      viewBox: `0 0 ${vm.svgWidth} ${vm.svgHeight}`,
-      preserveAspectRatio,
-      children: [
-        vm.defs && vm.defs.length > 0 && /* @__PURE__ */ jsx("defs", { children: vm.defs.map(
-          (def, i) => def.kind === "linearGradient" ? /* @__PURE__ */ jsx(
-            "linearGradient",
-            {
-              id: def.id,
-              x1: def.x1,
-              y1: def.y1,
-              x2: def.x2,
-              y2: def.y2,
-              children: renderGradientStops(def.stops)
-            },
-            `${elementId}-def-${i}`
-          ) : def.kind === "radialGradient" ? /* @__PURE__ */ jsx(
-            "radialGradient",
-            {
-              id: def.id,
-              cx: def.cx,
-              cy: def.cy,
-              r: def.r,
-              children: renderGradientStops(def.stops)
-            },
-            `${elementId}-def-${i}`
-          ) : /* @__PURE__ */ jsx(
-            "pattern",
-            {
-              id: def.id,
-              patternUnits: def.patternUnits,
-              x: def.x,
-              y: def.y,
-              width: def.width,
-              height: def.height,
-              children: /* @__PURE__ */ jsx(
-                "image",
-                {
-                  href: def.href,
-                  x: 0,
-                  y: 0,
-                  width: def.width,
-                  height: def.height,
-                  preserveAspectRatio: def.preserveAspectRatio
-                }
-              )
-            },
-            `${elementId}-def-${i}`
-          )
-        ) }),
-        vm.areaFill && /* @__PURE__ */ jsx(
-          "rect",
-          {
-            x: 0,
-            y: 0,
-            width: vm.svgWidth,
-            height: vm.svgHeight,
-            rx: vm.areaRadius,
-            fill: vm.areaFill
-          }
-        ),
-        vm.title && /* @__PURE__ */ jsx(
-          "text",
-          {
-            x: vm.titleX,
-            y: vm.titleY,
-            textAnchor: "middle",
-            fontSize: vm.titleStyle?.fontSize ?? 12,
-            fontWeight: vm.titleStyle?.fontWeight ?? 600,
-            fontFamily: vm.titleStyle?.fontFamily,
-            fill: vm.titleStyle?.fill ?? "#1e293b",
-            "data-chart-part": "title",
-            children: vm.titleRunSpans && vm.titleRunSpans.length > 0 ? vm.titleRunSpans.map((run, i) => /* @__PURE__ */ jsx(
-              "tspan",
-              {
-                fontSize: run.fontSize,
-                fontWeight: run.fontWeight,
-                fontStyle: run.fontStyle,
-                fontFamily: run.fontFamily,
-                fill: run.fill,
-                children: run.text
-              },
-              `${elementId}-title-run-${i}`
-            )) : vm.title
-          }
-        ),
-        vm.gridlines.map((gl, i) => /* @__PURE__ */ jsx(
-          "line",
-          {
-            x1: gl.x1,
-            y1: gl.y1,
-            x2: gl.x2,
-            y2: gl.y2,
-            stroke: gl.stroke,
-            strokeWidth: gl.strokeWidth
-          },
-          `${elementId}-gl-${i}`
-        )),
-        (vm.secondaryGridlines ?? []).map((gl, i) => /* @__PURE__ */ jsx(
-          "line",
-          {
-            x1: gl.x1,
-            y1: gl.y1,
-            x2: gl.x2,
-            y2: gl.y2,
-            stroke: gl.stroke,
-            strokeWidth: gl.strokeWidth,
-            strokeDasharray: gl.dashArray,
-            opacity: gl.opacity ?? 1
-          },
-          `${elementId}-sgl-${i}`
-        )),
-        vm.axisLabels.map((lbl, i) => renderText(lbl, `${elementId}-al-${i}`)),
-        (vm.secondaryAxisLabels ?? []).map((lbl, i) => renderText(lbl, `${elementId}-sal-${i}`)),
-        vm.zeroLine && /* @__PURE__ */ jsx(
-          "line",
-          {
-            x1: vm.zeroLine.x1,
-            y1: vm.zeroLine.y1,
-            x2: vm.zeroLine.x2,
-            y2: vm.zeroLine.y2,
-            stroke: vm.zeroLine.stroke,
-            strokeWidth: vm.zeroLine.strokeWidth
-          }
-        ),
-        vm.categoryLabels.map((lbl, i) => renderText(lbl, `${elementId}-cl-${i}`)),
-        vm.primitives.map((prim, i) => renderPrimitive(prim, `${elementId}-p-${i}`)),
-        vm.dataLabels.map((dl, i) => renderText(dl, `${elementId}-dl-${i}`)),
-        legendItems.map((item, i) => /* @__PURE__ */ jsxs(
-          "g",
-          {
-            transform: `translate(${item.x.toFixed(1)},${item.y.toFixed(1)})`,
-            children: [
-              item.lineSwatch ? item.lineSwatch.primitives.map(
-                (prim, si) => renderPrimitive(prim, `${elementId}-lg-${i}-sw-${si}`)
-              ) : /* @__PURE__ */ jsx("rect", { x: 0, y: -7, width: 10, height: 10, rx: 2, fill: item.color }),
-              /* @__PURE__ */ jsx(
-                "text",
-                {
-                  x: 13,
-                  y: 3,
-                  fontSize: item.fontSize,
-                  fill: item.fill,
-                  fontWeight: item.fontWeight,
-                  fontStyle: item.fontStyle,
-                  fontFamily: item.fontFamily,
-                  children: item.label
-                }
-              )
-            ]
-          },
-          `${elementId}-lg-${i}`
-        ))
-      ]
-    }
-  );
-}
-function renderChartElement(element) {
-  if (element.type !== "chart") {
-    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.chart.heading"] });
-  }
-  const chartData = element.chartData;
-  if (!chartData || chartData.series.length === 0) {
-    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.chart.heading"] });
-  }
-  const kind = resolveChartKind(chartData.chartType ?? "bar");
-  return renderChartViewModel(
-    element.id,
-    buildReactChartViewModel(element),
-    chartPreserveAspectRatio(kind)
-  );
-}
-
-// src/viewer/utils/pdf-builder-notes-builder.ts
-function buildNotesPdf(pages) {
-  const images = pages.map((page) => {
-    const dataUrl = page.canvas.toDataURL("image/jpeg", 0.92);
-    const base64 = dataUrl.split(",")[1] ?? "";
-    const raw = atob(base64);
-    const bytes2 = new Uint8Array(raw.length);
-    for (let i = 0; i < raw.length; i++) {
-      bytes2[i] = raw.charCodeAt(i);
-    }
-    return { bytes: bytes2, w: page.canvas.width, h: page.canvas.height };
-  });
-  const meta = pages.map((page) => ({
-    notes: page.notes,
-    slideNumber: page.slideNumber
-  }));
-  const bytes = buildNotesPdfBytes(images, meta);
-  const blob = new Blob([bytes], { type: "application/pdf" });
-  return URL.createObjectURL(blob);
-}
-
-// src/viewer/utils/pdf-builder-slides.ts
-function buildPdfFromTiledImageData(pages) {
-  const bytes = buildTiledSlidesPdfBytes(pages);
-  const blob = new Blob([bytes], { type: "application/pdf" });
-  return URL.createObjectURL(blob);
-}
-
-// src/viewer/utils/animation-preview.ts
-var activePreview = null;
-function startPreviewAnimation(elementId, preset, options) {
-  stopPreviewAnimation();
-  const domEl = document.querySelector(`[data-element-id="${elementId}"]`);
-  const descriptor = buildPreviewAnimation(preset, {
-    ...options,
-    geometry: domEl ? measurePreviewGeometry(domEl) : void 0
-  });
-  if (!descriptor) {
-    return;
-  }
-  playDescriptor(elementId, descriptor);
-}
-function startMotionPathPreview(elementId, path, options) {
-  stopPreviewAnimation();
-  const domEl = document.querySelector(`[data-element-id="${elementId}"]`);
-  if (!domEl) {
-    return;
-  }
-  const stage = domEl.offsetParent;
-  const descriptor = buildMotionPathPreview({
-    path,
-    slideWidth: stage?.offsetWidth || DEFAULT_PREVIEW_SLIDE_WIDTH,
-    slideHeight: stage?.offsetHeight || DEFAULT_PREVIEW_SLIDE_HEIGHT,
-    durationMs: options?.durationMs,
-    delayMs: options?.delayMs,
-    timingCurve: options?.timingCurve
-  });
-  if (!descriptor) {
-    return;
-  }
-  playDescriptor(elementId, descriptor);
-}
-var DEFAULT_PREVIEW_SLIDE_WIDTH = 1280;
-var DEFAULT_PREVIEW_SLIDE_HEIGHT = 720;
-function playDescriptor(elementId, descriptor) {
-  const domEl = document.querySelector(`[data-element-id="${elementId}"]`);
-  if (!domEl) {
-    return;
-  }
-  const styleEl = document.createElement("style");
-  styleEl.textContent = descriptor.keyframesCss;
-  document.head.appendChild(styleEl);
-  const originalAnimation = domEl.style.animation;
-  const originalVisibility = domEl.style.visibility;
-  domEl.style.visibility = "visible";
-  domEl.style.animation = descriptor.cssAnimation;
-  const timeoutId = setTimeout(() => {
-    domEl.style.animation = originalAnimation;
-    domEl.style.visibility = originalVisibility;
-    styleEl.remove();
-    if (activePreview?.elementId === elementId) {
-      activePreview = null;
-    }
-  }, descriptor.durationMs + 100);
-  activePreview = {
-    elementId,
-    timeoutId,
-    styleEl,
-    originalAnimation,
-    originalVisibility
-  };
-}
-function stopPreviewAnimation() {
-  if (!activePreview) {
-    return;
-  }
-  clearTimeout(activePreview.timeoutId);
-  activePreview.styleEl.remove();
-  const domEl = document.querySelector(
-    `[data-element-id="${activePreview.elementId}"]`
-  );
-  if (domEl) {
-    domEl.style.animation = activePreview.originalAnimation;
-    domEl.style.visibility = activePreview.originalVisibility;
-  }
-  activePreview = null;
-}
-
-export { ANIMATION_PRESET_OPTIONS, ARROW_SIZE_OPTIONS, CONNECTOR_ARROW_OPTIONS, DEFAULT_CANVAS_HEIGHT, DEFAULT_CANVAS_WIDTH, DEFAULT_FILL_COLOR, DEFAULT_FONT_FAMILY2 as DEFAULT_FONT_FAMILY, DEFAULT_SECTION_GROUP_ID, DEFAULT_STROKE_COLOR, DEFAULT_TABLE_COLUMNS, DEFAULT_TABLE_ROWS, DEFAULT_TEXT_COLOR, DEFAULT_TEXT_FONT_SIZE, GRID_SIZE, HYPERLINK_COLOR, MIN_ELEMENT_SIZE, SHAPE_PRESETS, SHORTCUT_REFERENCE_ITEMS, SLIDE_NAV_THUMBNAIL_WIDTH, STROKE_DASH_OPTIONS2 as STROKE_DASH_OPTIONS, TOOLBAR_SECTIONS, UNGROUPED_SECTION_ID, ZOOM_TO_SELECTION_PADDING, build3DExtrusionData2 as build3DExtrusionData, buildLineGlowFilter, buildLineShadowCss, buildNotesPdf, buildPdfFromTiledImageData, buildReactChartViewModel, buildTextBody3DSceneStyle2 as buildTextBody3DSceneStyle, cloneHistorySnapshot2 as cloneHistorySnapshot, cn, getAnimationInitialStyle2 as getAnimationInitialStyle, getConnectorPathGeometry2 as getConnectorPathGeometry, getCropShapeClipPath2 as getCropShapeClipPath, getDuotoneColors, getImageRenderStyle, getImageSurfaceMaskStyle, getImageSurfaceStyle, getImageTilingStyle2 as getImageTilingStyle, getShapeVisualStyle, getTextLayoutStyle, getTextStyleForElement, getTextWarpStyle, hasDagDuotoneEffect, isConnectorOrLineElement, renderChartElement, renderConnectorMarker, renderDagDuotoneSvgFilter, renderMediaElement, renderTableElement, renderTextSegments, renderVectorShape, shouldRenderFallbackLabel, startMotionPathPreview, startPreviewAnimation, stopPreviewAnimation };