ooxml-ui 0.30.1 → 1.0.0

package/dist/pptx/dom/index.mjs

@@ -0,0 +1,4057 @@
+import { GlyphOutlineFontCache, createGlyphOutlineLookup, getActiveXControlOverlayView, buildCommentMarkers, COMMENT_MARKER_SIZE, getComputedEffectStyle, getComputedStrokeStyle, px, getComputed3dStyle, isHollowShapeElement, resolveShapeGeometry, buildTextBlockStyle, buildTextBody3DSceneStyle, getSlideBackgroundStyle, applyRenderedElementAccessibility, applyElementActionAffordances, isTemplateElementId, actionAffordanceLabels, canDrillDown, beginChartMarkDrag, THREE_VIEW_EVENTS, applyChart3DSelect, applyChart3DDrag, resolveChartThreeViewSpec, getContainerStyle, resolveRevealedChartData, chartPlaceholderLabel, buildTextBuildSpec, textBuildSpanStyle, getLineGlowFilterCss, getLineShadowParams, normalizeArrow, getCompoundLineOffsets, getCompoundLineWidths, connectorNeedsPath, connectorHitStrokeWidth, buildParagraphs, markerPath, isEquationOnlyText, convertOmmlToMathMl, sanitizeMathMl, build3DExtrusionData, getGroupChildParentFill, resolveGroupChildFill, getImageSrc, getImageFitStyle, getEffectStyleSource, getDuotoneSvgFilter, getSoftEdgeSvgFilter, getBevelLightingSvgFilter, buildHollowHitOutline, strokeOutlineViewBox, buildStrokeOutline, isPatternPaint, svgGradientMarkup, getCropShapeClipPath, getImageOverflow, getComputedImageStyle, getImageTilingStyle, getCachedNativeImageSize, probeNativeImageSize, getImageFillCounterTransform, resolveColorChangedImageSource, getImageColorWashStyle, buildInkGroupStrokes, applyMediaPlaybackAttributes, startMediaAutoplay, scheduleMediaTrimAndFade, mediaPlaybackAttributes, mediaSurfaceOf, mediaTransportVisible, getOnlineVideoEmbed, ONLINE_VIDEO_IFRAME_ALLOW, ONLINE_VIDEO_IFRAME_SANDBOX, registerCrossSlideAudio, mediaFallbackVisual, mediaFallbackIcon, mediaFallbackLabelKey, MEDIA_CHROME_ATTRIBUTE, getOleIconShapes, resolveOleType, getOleTypeColor, getOleTypeLabel, getOleAriaLabel, getOleBadgeLabel, oleActionsVisible, formatBytes, getPlaceholderStyle, getOleDisplayName, isBrowserOpenableMime, openUrlInNewTab, buildSummaryZoomView, resolveSmartArtThreeViewSpec, elementInLocalFrame, stripEditLayerMarkers, routeEditLayerPointerToNodes, measureSvgViewportRect, findSmartArtNodeText, resolvePalette, smartArtConnectorPaint, smartArtNodeLabel, buildChromeStyle, buildSmartArtA11y, resolveRevealedSmartArtNodes, resolveRevealedDrawingShapes, computeSmartArtElementLayout, flattenNodes, computeDrawingViewBox, projectDrawingShapes, styleShadowFilter, resolveRevealedDrawingShapeNodeIds, getTableResizeScale, computeColumnBoundaries, DEFAULT_ROW_HEIGHT, tableContainerCss, tableCellCss, cellPatternFillCss, getCellDiagonalBorders, cellRunStyle, groupIntoParagraphs, shouldUseSvgWarp, getWarpCssTransform, hasGlyphEnvelope, buildGlyphEnvelopeBlock, buildWarpPath, elementHitTargetStyle, getOverflowSegments, placeholderPromptDescriptor, advanceChartMarkDrag, computeResizedColumnWidths, computeResizedRowHeight, isElementRendered, shouldRenderHitTarget, resolveZoomNavigationTarget, isMediaFullscreenActive, MEDIA_FULLSCREEN_OVERLAY_STYLE, shouldShowMediaFullscreenStopButton, runEquationMathMl } from '../chunk-XWE5GSE7.mjs';
+export { buildEmbeddedFontStyles, buildFieldSubstitutionContext } from '../chunk-XWE5GSE7.mjs';
+import '../chunk-A63ASSCH.mjs';
+import { modelDataToBlobUrl, mountModel3D } from '../chunk-DMWNOP4E.mjs';
+import '../chunk-WSR2S2MY.mjs';
+import '../chunk-GVH4QN7R.mjs';
+import '../chunk-BPAA5FSB.mjs';
+import '../chunk-APQ3OOAT.mjs';
+import { ensureChartInteractionStyles, CHART_INTERACTIVE_CLASS, applyChartPartHighlight, findChartPartTarget, buildChartMarkDragGeometry, beginChartValueDrag, advanceChartValueDrag, renderChartViewModelSvg, withChartTitle } from '../chunk-YOGDIDPB.mjs';
+export { renderChartViewModelSvg } from '../chunk-YOGDIDPB.mjs';
+import '../chunk-RQJOOXRG.mjs';
+import '../chunk-PI47Z46K.mjs';
+import '../chunk-QX6XPYVA.mjs';
+import '../chunk-NVYVHNPD.mjs';
+import '../chunk-KY75GY5O.mjs';
+import '../chunk-L55MIOBC.mjs';
+import '../chunk-VD7HRMTA.mjs';
+import '../chunk-SMSCEGAE.mjs';
+import '../chunk-7BHPBO2O.mjs';
+import { getComputedFillStyle, DEFAULT_STROKE_COLOR, getCssBorderDashStyle, DEFAULT_TEXT_COLOR, buildChartViewModel, resolveChartKind, subscribeBarFacePicturePixelSamples, getChartStylePalette, buildDashArray, buildSubpathFillOverlay, DEFAULT_FONT_FAMILY, DEFAULT_CANVAS_HEIGHT, DEFAULT_CANVAS_WIDTH, formatAxisValue } from '../chunk-YARCML7O.mjs';
+import { buildContentPartStrokes } from '../chunk-IB6ZM2E2.mjs';
+import { getContentPartReplayStyles, INK_REPLAY_KEYFRAMES, getInkReplayStyles } from '../chunk-JA7WYSRE.mjs';
+import '../chunk-V4YMLIGL.mjs';
+import '../chunk-MNSWEXYO.mjs';
+import { THREE_VIEW_TAG, defineThreeViewElement } from '../chunk-ADOC5JLI.mjs';
+import '../chunk-2V5ATMMB.mjs';
+import '../chunk-A62C6PSL.mjs';
+import '../chunk-3ZI57W7O.mjs';
+import '../chunk-IXFG46KB.mjs';
+import '../chunk-IEAO7N4E.mjs';
+import '../chunk-XAOEDYA5.mjs';
+import '../chunk-7KPDES3X.mjs';
+import '../chunk-T7FRLIDM.mjs';
+import '../chunk-XRWEURSV.mjs';
+import { resolveTableCellImageUrls, resolveTableStyleImageUrls, resolveTextFillBlipUrls, collectMediaElements, resolveMediaElementSource, collectAnimationSoundPaths, collectImagePaths, applyImagePathPatches } from '../chunk-AEQGGKRZ.mjs';
+import { keyToLabel } from '../chunk-JSBGBVBH.mjs';
+export { createTranslator } from '../chunk-JSBGBVBH.mjs';
+import '../chunk-CENGE3TZ.mjs';
+import '../chunk-7JBQPQ6G.mjs';
+import '../chunk-WHUMPYEM.mjs';
+import { hasShapeProperties, hasTextProperties, getConnectorPathGeometry, isImageLikeElement, getSubstituteFontFamily, PptxHandler } from 'ooxml-core/pptx';
+
+// src/pptx/dom/dom.ts
+function toCssPropertyName(key) {
+  return key.replace(/[A-Z]/gu, (c) => `-${c.toLowerCase()}`);
+}
+function applyStyleMap(el, style) {
+  for (const [key, value] of Object.entries(style)) {
+    if (value === void 0 || value === null) {
+      continue;
+    }
+    const property = key.startsWith("--") || key.includes("-") ? key : toCssPropertyName(key);
+    el.style.setProperty(property, String(value));
+  }
+}
+function createEl(doc, tag, className, style) {
+  const el = doc.createElement(tag);
+  if (className) {
+    el.className = className;
+  }
+  if (style) {
+    applyStyleMap(el, style);
+  }
+  return el;
+}
+var SVG_NS = "http://www.w3.org/2000/svg";
+function createSvgEl(doc, tag, attrs) {
+  const el = doc.createElementNS(SVG_NS, tag);
+  if (attrs) {
+    setSvgAttrs(el, attrs);
+  }
+  return el;
+}
+function setSvgAttrs(el, attrs) {
+  for (const [name, value] of Object.entries(attrs)) {
+    if (value !== void 0) {
+      el.setAttribute(name, String(value));
+    }
+  }
+}
+function composeTransforms(first, second) {
+  const a = first === void 0 ? "" : String(first);
+  const b = second === void 0 ? "" : String(second);
+  if (a && b) {
+    return `${a} ${b}`;
+  }
+  return a || b || void 0;
+}
+
+// src/pptx/dom/activex-controls-overlay.ts
+function buildActiveXControlsOverlay(doc, controls, canvasSize) {
+  const overlay = createEl(doc, "div", "pptxv-activex-overlay", {
+    position: "absolute",
+    inset: "0",
+    pointerEvents: "none",
+    zIndex: "40"
+  });
+  controls.forEach((control, index) => {
+    const view = getActiveXControlOverlayView(control, canvasSize, index);
+    const style = {
+      position: "absolute",
+      left: `${view.left}px`,
+      top: `${view.top}px`,
+      width: `${view.width}px`,
+      height: `${view.height}px`
+    };
+    if (view.className === "image" && view.imageUrl) {
+      const img = createEl(doc, "img", "pptxv-activex-overlay-image", style);
+      img.src = view.imageUrl;
+      img.alt = view.label;
+      img.title = `ActiveX control: ${view.label}`;
+      overlay.appendChild(img);
+      return;
+    }
+    const badge = createEl(doc, "div", "pptxv-activex-overlay-placeholder", style);
+    badge.title = `ActiveX control: ${view.label} (interactive controls are not supported in the viewer)`;
+    badge.textContent = view.label;
+    overlay.appendChild(badge);
+  });
+  return overlay;
+}
+
+// src/pptx/dom/comment-markers.ts
+function appendCommentMarkers(doc, stage, comments, canvasSize, t, onMarkerClick) {
+  if (comments.length === 0) {
+    return;
+  }
+  const overlay = createEl(doc, "div", "pptxv-comment-markers", {
+    position: "absolute",
+    inset: "0",
+    pointerEvents: "none",
+    zIndex: "45"
+  });
+  const markers = buildCommentMarkers(
+    comments,
+    canvasSize.width,
+    canvasSize.height,
+    t("pptx.comments.unknownAuthor")
+  );
+  for (const marker of markers) {
+    const dot = createEl(doc, "button", "pptxv-comment-marker", {
+      position: "absolute",
+      left: `${marker.x - COMMENT_MARKER_SIZE / 2}px`,
+      top: `${marker.y - COMMENT_MARKER_SIZE / 2}px`,
+      width: `${COMMENT_MARKER_SIZE}px`,
+      height: `${COMMENT_MARKER_SIZE}px`,
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      padding: "0",
+      pointerEvents: "auto",
+      cursor: "pointer",
+      borderRadius: "50%",
+      background: "rgba(255, 165, 0, 0.9)",
+      border: "2px solid #fff",
+      boxShadow: "0 1px 3px rgba(0, 0, 0, 0.3)",
+      fontSize: "10px",
+      fontWeight: "700",
+      lineHeight: "1",
+      color: "#fff"
+    });
+    dot.type = "button";
+    dot.title = marker.title;
+    dot.textContent = marker.label;
+    dot.addEventListener("click", (event) => {
+      event.stopPropagation();
+      onMarkerClick?.(marker.commentId);
+    });
+    overlay.appendChild(dot);
+  }
+  stage.appendChild(overlay);
+}
+function merge3dStyle(base, computed) {
+  if (!computed) {
+    return;
+  }
+  const shadows = [base["boxShadow"], computed.extrusionBoxShadow, computed.boxShadow].filter((s) => s !== void 0 && s !== "").map(String);
+  if (shadows.length > 0) {
+    base["boxShadow"] = shadows.join(", ");
+  }
+  if (computed.transform) {
+    base["transform"] = base["transform"] ? `${String(base["transform"])} ${computed.transform}` : computed.transform;
+  }
+  if (computed.perspective) {
+    base["perspective"] = computed.perspective;
+  }
+  if (computed.perspectiveOrigin) {
+    base["perspectiveOrigin"] = computed.perspectiveOrigin;
+  }
+  if (computed.transformOrigin) {
+    base["transformOrigin"] = computed.transformOrigin;
+  }
+  if (computed.transformStyle) {
+    base["transformStyle"] = computed.transformStyle;
+  }
+  if (computed.willChange) {
+    base["willChange"] = computed.willChange;
+  }
+  if (computed.filter) {
+    base["filter"] = base["filter"] ? `${String(base["filter"])} ${computed.filter}` : computed.filter;
+  }
+  if (computed.backgroundImage) {
+    base["backgroundImage"] = base["backgroundImage"] ? `${computed.backgroundImage}, ${String(base["backgroundImage"])}` : computed.backgroundImage;
+  }
+  if (computed.background && base["background"] === void 0) {
+    base["background"] = computed.background;
+  }
+  if (computed.opacity !== void 0 && base["opacity"] === void 0) {
+    base["opacity"] = computed.opacity;
+  }
+}
+function getShapeFillStrokeStyle(el, animatesFill, animatesStroke) {
+  if (el.type === "group") {
+    const fx2 = getComputedEffectStyle(el);
+    const groupStyle = {};
+    if (fx2.filter) {
+      groupStyle.filter = fx2.filter;
+    }
+    if (fx2.overflowVisible) {
+      groupStyle.overflow = "visible";
+    }
+    return groupStyle;
+  }
+  if (!hasShapeProperties(el)) {
+    return {};
+  }
+  const ss = el.shapeStyle;
+  const style = {};
+  if (ss) {
+    const fill = animatesFill ? void 0 : getComputedFillStyle(el);
+    for (const [key, value] of Object.entries(fill ?? {})) {
+      if (value !== void 0) {
+        style[key] = value;
+      }
+    }
+    const stroke = getComputedStrokeStyle(el);
+    if (stroke.borderWidth > 0) {
+      if (animatesStroke) {
+        style["borderWidth"] = px(stroke.borderWidth);
+        style["borderStyle"] = stroke.borderStyle ?? "solid";
+      } else {
+        style["border"] = stroke.border ?? "";
+      }
+    }
+    if (stroke.strokeLinejoin) {
+      style["strokeLinejoin"] = stroke.strokeLinejoin;
+    }
+    if (stroke.strokeLinecap) {
+      style["strokeLinecap"] = stroke.strokeLinecap;
+    }
+    if (stroke.strokeMiterlimit !== void 0) {
+      style["strokeMiterlimit"] = stroke.strokeMiterlimit;
+    }
+  }
+  const fx = getComputedEffectStyle(el);
+  if (fx.boxShadow) {
+    style["boxShadow"] = fx.boxShadow;
+  }
+  if (fx.filter) {
+    style["filter"] = fx.filter;
+  }
+  if (fx.mixBlendMode) {
+    style["mixBlendMode"] = fx.mixBlendMode;
+  }
+  if (fx.opacity !== void 0) {
+    const elementOpacity = typeof el.opacity === "number" ? el.opacity : 1;
+    style["opacity"] = elementOpacity * fx.opacity;
+  }
+  if (fx.overflowVisible) {
+    style["overflow"] = "visible";
+  }
+  merge3dStyle(style, getComputed3dStyle(el));
+  if (isHollowShapeElement(el)) {
+    style["pointerEvents"] = "none";
+  }
+  const geometry = resolveShapeGeometry(el);
+  switch (geometry.kind) {
+    case "bare":
+      style["backgroundColor"] = "transparent";
+      style["border"] = "none";
+      return style;
+    case "strokeOnly":
+      style["backgroundColor"] = "transparent";
+      delete style["backgroundImage"];
+      style["border"] = "none";
+      return style;
+    case "borderRadius":
+      style["borderRadius"] = geometry.radius;
+      return style;
+    case "clipPath":
+      style["clipPath"] = geometry.clipPath;
+      return style;
+    case "lineEdge":
+      style["backgroundColor"] = "transparent";
+      style["border"] = "none";
+      style["borderTop"] = `${px(geometry.strokeWidth)} ${getCssBorderDashStyle(el.shapeStyle?.strokeDash)} ${el.shapeStyle?.strokeColor ?? DEFAULT_STROKE_COLOR}`;
+      return style;
+    default:
+      return style;
+  }
+}
+function getTextBlockStyle(el) {
+  if (!hasTextProperties(el)) {
+    return {};
+  }
+  const base = buildTextBlockStyle(el, {
+    fallbackColor: DEFAULT_TEXT_COLOR,
+    bodyLayout: true,
+    pxLengths: true
+  });
+  const scene3d = buildTextBody3DSceneStyle(el.textStyle, { width: el.width, height: el.height });
+  if (!scene3d) {
+    return base;
+  }
+  const merged = { ...base, ...scene3d };
+  const transform = composeTransforms(base.transform, scene3d.transform);
+  if (transform !== void 0) {
+    merged.transform = transform;
+  }
+  return merged;
+}
+
+// src/pptx/dom/presentation-rerender.ts
+function findRenderable(elements, id) {
+  for (const [index, element] of elements.entries()) {
+    if (element.id === id) {
+      return { element, zIndex: index };
+    }
+    if (element.type === "group") {
+      const nested = findRenderable(element.children ?? [], id);
+      if (nested) {
+        return nested;
+      }
+    }
+  }
+  return void 0;
+}
+function findElementNode(root, id) {
+  for (const node of root.querySelectorAll("[data-element-id]")) {
+    if (node.dataset.elementId === id) {
+      return node;
+    }
+  }
+  return null;
+}
+function reRenderPresentationElements(context, stage, ids) {
+  for (const id of ids) {
+    const found = findRenderable(context.slide.elements, id);
+    const old = findElementNode(stage, id);
+    if (!found || !old) {
+      continue;
+    }
+    const fresh = context.renderElement(found.element, found.zIndex);
+    if (!fresh) {
+      continue;
+    }
+    if (found.element.type === "chart" || found.element.type === "smartArt") {
+      old.replaceChildren(...Array.from(fresh.childNodes));
+    } else {
+      old.replaceWith(fresh);
+    }
+  }
+}
+
+// src/pptx/dom/registry.ts
+function createElementRendererRegistry() {
+  const renderers = /* @__PURE__ */ new Map();
+  let fallback = () => null;
+  return {
+    register(type, renderer) {
+      renderers.set(type, renderer);
+    },
+    unregister(type) {
+      renderers.delete(type);
+    },
+    get(type) {
+      return renderers.get(type);
+    },
+    has(type) {
+      return renderers.has(type);
+    },
+    setFallback(renderer) {
+      fallback = renderer;
+    },
+    resolve(type) {
+      return renderers.get(type) ?? fallback;
+    },
+    registeredTypes() {
+      return Array.from(renderers.keys()).sort();
+    }
+  };
+}
+
+// src/pptx/dom/slide-stage.ts
+function renderSlideStage(options) {
+  const { document: doc, slide, canvasSize, mediaDataUrls, registry, t } = options;
+  const scale = options.scale ?? 1;
+  const interactive = options.interactive ?? false;
+  const stage = createEl(doc, "div", "pptxv-stage", {
+    width: `${canvasSize.width}px`,
+    height: `${canvasSize.height}px`,
+    transform: `scale(${scale})`,
+    transformOrigin: "top left",
+    position: "relative",
+    overflow: "hidden",
+    // Motion-path keyframes translate by a fraction of the SLIDE (a CSS
+    // `translate(%)` would resolve against the ELEMENT box instead and make a
+    // small shape barely move), so every stage publishes its own size for
+    // those `calc()` offsets. Set here rather than at the call sites so the
+    // editing stage and the presentation stage can never disagree.
+    "--pptx-slide-w": `${canvasSize.width}px`,
+    "--pptx-slide-h": `${canvasSize.height}px`,
+    "--pptxv-grid-size": `${options.gridSpacingPx ?? 10}px`,
+    ...getSlideBackgroundStyle(slide, { widthPx: canvasSize.width, heightPx: canvasSize.height })
+  });
+  if (interactive || options.reading) {
+    stage.setAttribute("role", "region");
+    stage.setAttribute("aria-roledescription", "slide");
+    stage.setAttribute("aria-label", t("pptx.canvas.slide"));
+  }
+  const context = {
+    reading: options.reading,
+    document: doc,
+    slide,
+    slides: options.slides,
+    currentSlideIndex: options.currentSlideIndex,
+    onZoomClick: options.onZoomClick,
+    canvasSize,
+    scale,
+    mediaDataUrls,
+    colorScheme: options.colorScheme,
+    fontScheme: options.fontScheme,
+    tableStyleMap: options.tableStyleMap,
+    fieldContext: options.fieldContext,
+    presentationStates: options.presentationStates,
+    t,
+    smartArt3D: options.smartArt3D ?? false,
+    surfaceChart3D: options.surfaceChart3D ?? false,
+    barChart3D: options.barChart3D ?? false,
+    lineChart3D: options.lineChart3D ?? false,
+    areaChart3D: options.areaChart3D ?? false,
+    pieChart3D: options.pieChart3D ?? false,
+    presenting: options.presenting ?? false,
+    interactive,
+    onSmartArtNodeTextChange: options.onSmartArtNodeTextChange,
+    onSmartArtNodeFillChange: options.onSmartArtNodeFillChange,
+    onChartPointChange: options.onChartPointChange,
+    onTableResizeColumns: options.onTableResizeColumns,
+    onTableResizeRow: options.onTableResizeRow,
+    chartPartSelection: options.chartPartSelection,
+    onChartPartSelect: options.onChartPartSelect,
+    selectedElementIds: options.selectedElementIds,
+    registry,
+    renderElement(element, zIndex) {
+      if (!isElementRendered(element)) {
+        return null;
+      }
+      const node = registry.resolve(element.type)(element, zIndex, context);
+      if (node && interactive && "setAttribute" in node) {
+        const templateLocked = isTemplateElementId(element.id) && !options.templateEditing;
+        if (templateLocked) {
+          node.style.pointerEvents = "none";
+        }
+        node.setAttribute("data-pptx-element", "true");
+      }
+      if (node && element.type !== "text" && element.type !== "shape" && element.type !== "connector" && shouldRenderHitTarget(interactive, options.presenting ?? false)) {
+        const hitTargetStyle = elementHitTargetStyle(element);
+        if (hitTargetStyle) {
+          const hitTarget = createEl(doc, "div", void 0, hitTargetStyle);
+          hitTarget.setAttribute("aria-hidden", "true");
+          hitTarget.setAttribute("data-pptx-hit-target", "true");
+          node.appendChild(hitTarget);
+        }
+      }
+      return node;
+    }
+  };
+  options.captureContext?.(context);
+  slide.elements.forEach((element, index) => {
+    const node = context.renderElement(element, index);
+    if (node) {
+      stage.appendChild(node);
+    }
+  });
+  if (interactive || options.reading) {
+    applyRenderedElementAccessibility(stage, slide.elements, {
+      presenting: options.presenting ?? false
+    });
+  }
+  if (interactive) {
+    applyElementActionAffordances(
+      stage,
+      slide.elements.filter(
+        (element) => options.templateEditing || !isTemplateElementId(element.id)
+      ),
+      {
+        canInteract: true,
+        presenting: options.presenting ?? false,
+        labels: actionAffordanceLabels((key) => t(key))
+      }
+    );
+  }
+  if (slide.activeXControls && slide.activeXControls.length > 0) {
+    stage.appendChild(buildActiveXControlsOverlay(doc, slide.activeXControls, canvasSize));
+  }
+  return stage;
+}
+
+// src/pptx/dom/elements/chart-title-editor.ts
+function createChartTitleEditor(container, onCommit) {
+  let activeInput = null;
+  const close = (input = activeInput) => {
+    if (!input || input !== activeInput) {
+      return;
+    }
+    activeInput = null;
+    input.remove();
+  };
+  return (initialValue) => {
+    close();
+    const input = container.ownerDocument.createElement("input");
+    activeInput = input;
+    input.type = "text";
+    input.className = "pptxv-chart-title-input";
+    input.value = initialValue;
+    const commit = () => {
+      if (input !== activeInput) {
+        return;
+      }
+      const value = input.value;
+      close(input);
+      onCommit(value);
+    };
+    input.addEventListener("blur", commit, { once: true });
+    input.addEventListener("keydown", (event) => {
+      if (event.key === "Enter") {
+        event.preventDefault();
+        commit();
+      } else if (event.key === "Escape") {
+        event.preventDefault();
+        close(input);
+      }
+      event.stopPropagation();
+    });
+    input.addEventListener("pointerdown", (event) => event.stopPropagation());
+    input.addEventListener("dblclick", (event) => event.stopPropagation());
+    container.appendChild(input);
+    input.focus();
+    input.select();
+  };
+}
+
+// src/pptx/dom/elements/chart-editable.ts
+function attachChartEditing(container, element, context, repaint) {
+  if (element.type !== "chart" || !context.interactive || !context.onChartPointChange || !canDrillDown(element)) {
+    return;
+  }
+  const chart = element;
+  if (!chart.chartData) {
+    return;
+  }
+  if (!context.selectedElementIds?.has(element.id)) {
+    return;
+  }
+  ensureChartInteractionStyles();
+  container.classList.add(CHART_INTERACTIVE_CLASS);
+  let active = null;
+  let activeMark = null;
+  let selected = context.chartPartSelection?.elementId === element.id ? context.chartPartSelection.part : null;
+  let badge = null;
+  applyChartPartHighlight(container, selected);
+  const showBadge = (text) => {
+    if (!badge) {
+      badge = container.ownerDocument.createElement("div");
+      badge.className = "pptxv-chart-drag-badge";
+      container.appendChild(badge);
+    }
+    badge.textContent = text;
+  };
+  const clearBadge = () => {
+    badge?.remove();
+    badge = null;
+  };
+  const onKeydown = (event) => {
+    if (event.key === "Escape") {
+      end(false);
+    }
+  };
+  const onMove = (event) => {
+    if (activeMark) {
+      const rect = container.querySelector("svg")?.getBoundingClientRect();
+      if (!rect) {
+        return;
+      }
+      const step2 = advanceChartMarkDrag(activeMark, event.clientX, event.clientY, rect);
+      if (!step2) {
+        return;
+      }
+      repaint(step2.chartData);
+      applyChartPartHighlight(container, selected);
+      showBadge(formatAxisValue(step2.value));
+      return;
+    }
+    if (!active) {
+      return;
+    }
+    const height = container.querySelector("svg")?.getBoundingClientRect().height ?? 0;
+    const step = advanceChartValueDrag(active, event.clientY, height);
+    if (!step) {
+      return;
+    }
+    repaint(step.chartData);
+    applyChartPartHighlight(container, selected);
+    showBadge(formatAxisValue(step.value));
+  };
+  const onUp = () => {
+    if (active || activeMark) {
+      end(true);
+    }
+  };
+  function end(commit) {
+    const finished = active;
+    const finishedMark = activeMark;
+    active = null;
+    activeMark = null;
+    const view = container.ownerDocument.defaultView;
+    view?.removeEventListener("keydown", onKeydown);
+    view?.removeEventListener("pointermove", onMove);
+    view?.removeEventListener("pointerup", onUp);
+    clearBadge();
+    if (commit) {
+      const lastData = finished?.moved ? finished.lastData : finishedMark?.moved ? finishedMark.lastData : null;
+      if (lastData) {
+        context.onChartPointChange?.(element, lastData);
+        return;
+      }
+    }
+    if ((finished?.moved || finishedMark?.moved) && chart.chartData) {
+      repaint(chart.chartData);
+      applyChartPartHighlight(container, selected);
+    }
+  }
+  const openTitleEditor = createChartTitleEditor(container, (value) => {
+    if (chart.chartData) {
+      context.onChartPointChange?.(element, withChartTitle(chart.chartData, value));
+    }
+  });
+  container.addEventListener("dblclick", (event) => {
+    const target = event.target;
+    if (!(target instanceof Element)) {
+      return;
+    }
+    if (target.closest("[data-chart-part='title']")) {
+      event.stopPropagation();
+      if (chart.chartData) {
+        openTitleEditor(chart.chartData.title ?? "");
+      }
+      return;
+    }
+    if (findChartPartTarget(event.target)) {
+      event.stopPropagation();
+    }
+  });
+  container.addEventListener("pointerdown", (event) => {
+    const part = findChartPartTarget(event.target);
+    if (!part || !chart.chartData) {
+      return;
+    }
+    event.stopPropagation();
+    selected = part;
+    applyChartPartHighlight(container, selected);
+    context.onChartPartSelect?.(element, part);
+    const vm = buildChartViewModel(chart);
+    let captured = false;
+    const chartKind = resolveChartKind(chart.chartData.chartType ?? "bar");
+    if (part.pointIndex !== void 0 && chartKind !== "unsupported") {
+      const markGeometry = buildChartMarkDragGeometry({
+        kind: chartKind,
+        element: chart,
+        chartData: chart.chartData,
+        categoryLabels: chart.chartData.categories,
+        seriesIndex: part.seriesIndex,
+        pointIndex: part.pointIndex
+      });
+      const startedMark = beginChartMarkDrag({
+        part,
+        geometry: markGeometry,
+        chartData: chart.chartData,
+        svgWidth: vm.svgWidth,
+        svgHeight: vm.svgHeight,
+        clientX: event.clientX,
+        clientY: event.clientY
+      });
+      if (startedMark) {
+        activeMark = startedMark;
+        captured = true;
+      }
+    }
+    if (!captured) {
+      const started = beginChartValueDrag({
+        part,
+        viewModel: vm,
+        chartData: chart.chartData,
+        clientY: event.clientY
+      });
+      if (started) {
+        active = started;
+        captured = true;
+      }
+    }
+    if (!captured) {
+      return;
+    }
+    event.preventDefault();
+    try {
+      container.setPointerCapture?.(event.pointerId);
+    } catch {
+    }
+    const view = container.ownerDocument.defaultView;
+    view?.addEventListener("keydown", onKeydown);
+    view?.addEventListener("pointermove", onMove);
+    view?.addEventListener("pointerup", onUp);
+  });
+}
+
+// src/pptx/dom/elements/three-view-reuse.ts
+var pool = null;
+function collectThreeViews(root) {
+  const views = /* @__PURE__ */ new Map();
+  for (const view of root.querySelectorAll(THREE_VIEW_TAG)) {
+    if (view.spec && !views.has(view.spec)) {
+      views.set(view.spec, view);
+    }
+  }
+  return views;
+}
+function withReusableThreeViews(views, render) {
+  const previous = pool;
+  pool = views;
+  try {
+    return render();
+  } finally {
+    pool = previous;
+  }
+}
+function takeReusableThreeView(spec) {
+  const view = pool?.get(spec) ?? null;
+  if (view) {
+    pool?.delete(spec);
+  }
+  return view;
+}
+
+// src/pptx/dom/elements/three-view.ts
+function rendering3DFlagsOf(context) {
+  return {
+    smartArt3D: context.smartArt3D,
+    surfaceChart3D: context.surfaceChart3D,
+    barChart3D: context.barChart3D,
+    lineChart3D: context.lineChart3D,
+    areaChart3D: context.areaChart3D,
+    pieChart3D: context.pieChart3D
+  };
+}
+function mountThreeViewInto(doc, wrapper, options) {
+  defineThreeViewElement(doc.defaultView?.customElements);
+  const view = takeReusableThreeView(options.spec) ?? doc.createElement(THREE_VIEW_TAG);
+  view.replaceChildren(...Array.from(wrapper.childNodes));
+  view.spec = options.spec;
+  view.interactive = options.interactive;
+  view.selectedPart = options.selectedPart ?? null;
+  view.textStyle = options.textStyle;
+  wrapper.appendChild(view);
+  return view;
+}
+function isChart3DEditable(element, context) {
+  return element.type === "chart" && Boolean(context.interactive) && Boolean(context.onChartPointChange) && Boolean(context.selectedElementIds?.has(element.id)) && canDrillDown(element);
+}
+function selectedChartPartOf(element, context) {
+  return context.chartPartSelection?.elementId === element.id ? context.chartPartSelection.part : null;
+}
+function wireChartThreeViewEvents(view, element, context, badgeHost) {
+  if (element.type !== "chart") {
+    return;
+  }
+  let badge = null;
+  const bridge = {
+    elementId: element.id,
+    chartData: element.chartData,
+    canSelect: isChart3DEditable(element, context),
+    selectedElementId: context.chartPartSelection?.elementId ?? null,
+    // There is no "clear chart part selection" hook: an empty-space click
+    // leaves the selection alone, exactly like the 2D chart.
+    setSelection: (selection) => {
+      if (selection) {
+        view.selectedPart = selection.part;
+        context.onChartPartSelect?.(element, selection.part);
+      }
+    },
+    setDragValue: (value) => {
+      if (value === null) {
+        badge?.remove();
+        badge = null;
+        return;
+      }
+      if (!badge) {
+        badge = badgeHost.ownerDocument.createElement("div");
+        badge.className = "pptxv-chart-drag-badge";
+        badgeHost.appendChild(badge);
+      }
+      badge.textContent = formatAxisValue(value);
+    },
+    commitChartData: (next) => context.onChartPointChange?.(element, next)
+  };
+  chartViewListeners.get(view)?.abort();
+  const listeners = new AbortController();
+  chartViewListeners.set(view, listeners);
+  view.addEventListener(
+    THREE_VIEW_EVENTS.select,
+    (event) => applyChart3DSelect(bridge, event.detail.part),
+    { signal: listeners.signal }
+  );
+  view.addEventListener(
+    THREE_VIEW_EVENTS.drag,
+    (event) => applyChart3DDrag(bridge, event.detail),
+    { signal: listeners.signal }
+  );
+}
+var chartViewListeners = /* @__PURE__ */ new WeakMap();
+function applyThreeViewTextStyle(el, style) {
+  for (const view of el.querySelectorAll(THREE_VIEW_TAG)) {
+    view.textStyle = style;
+  }
+}
+
+// src/pptx/dom/elements/chart.ts
+var renderChartElement = (element, zIndex, context) => {
+  const wrapper = renderChartSvgElement(element, zIndex, context);
+  const spec = wrapper ? resolveChartThreeViewSpec(element, rendering3DFlagsOf(context)) : null;
+  if (!wrapper || !spec) {
+    return wrapper;
+  }
+  const view = mountThreeViewInto(context.document, wrapper, {
+    spec,
+    interactive: isChart3DEditable(element, context),
+    selectedPart: selectedChartPartOf(element, context),
+    textStyle: context.presentationStates?.get(element.id)?.textStyle
+  });
+  wireChartThreeViewEvents(view, element, context, wrapper);
+  return wrapper;
+};
+var renderChartSvgElement = (element, zIndex, context) => {
+  if (element.type !== "chart") {
+    return null;
+  }
+  const doc = context.document;
+  const container = createEl(
+    doc,
+    "div",
+    "pptxv-element pptxv-chart",
+    getContainerStyle(element, zIndex)
+  );
+  container.dataset.elementId = element.id;
+  const animationState = context.presentationStates?.get(element.id);
+  const chartData = element.chartData ? resolveRevealedChartData(element.chartData, animationState) : element.chartData;
+  if (!chartData || chartData.series.length === 0) {
+    container.appendChild(renderChartPlaceholder(doc, chartData?.chartType ?? "bar", context.t));
+    return container;
+  }
+  const kind = resolveChartKind(chartData.chartType ?? "bar");
+  if (kind === "unsupported") {
+    container.appendChild(renderChartPlaceholder(doc, chartData.chartType, context.t));
+    return container;
+  }
+  const preserveAspectRatio = kind === "pie" || kind === "doughnut" || kind === "radar" || kind === "regionMap" ? "xMidYMid meet" : "none";
+  const paint = (data) => {
+    const themedElement = {
+      ...element,
+      chartData: { ...data, colorPalette: resolveChartPalette(data) }
+    };
+    container.querySelector("svg")?.remove();
+    container.appendChild(
+      renderChartViewModelSvg(doc, buildChartViewModel(themedElement), preserveAspectRatio)
+    );
+  };
+  paint(chartData);
+  attachChartEditing(container, element, context, paint);
+  const unsubscribe = subscribeBarFacePicturePixelSamples(() => {
+    if (!container.isConnected) {
+      unsubscribe();
+      return;
+    }
+    paint(chartData);
+  });
+  return container;
+};
+function resolveChartPalette(chartData) {
+  if (chartData.colorPalette && chartData.colorPalette.length > 0) {
+    return [...chartData.colorPalette];
+  }
+  return [...getChartStylePalette(chartData.style?.styleId)];
+}
+function renderChartPlaceholder(doc, chartType, t) {
+  const placeholder = createEl(doc, "div", "pptxv-placeholder pptxv-chart-placeholder", {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    width: "100%",
+    height: "100%",
+    fontSize: "11px",
+    color: "#475569",
+    background: "#f1f5f9",
+    border: "1px dashed #cbd5e1",
+    boxSizing: "border-box"
+  });
+  placeholder.textContent = chartPlaceholderLabel(chartType, (key, params) => t(key, params));
+  return placeholder;
+}
+
+// src/pptx/dom/elements/text-run-content.ts
+function appendRunContent(doc, host, run) {
+  if (run.tabLines) {
+    appendTabLines(doc, host, run.tabLines);
+    return;
+  }
+  const pieces = run.scriptRuns ?? run.underlineWordPieces;
+  if (pieces) {
+    appendStyledPieces(doc, host, pieces);
+    return;
+  }
+  host.appendChild(doc.createTextNode(run.text));
+}
+function appendTabLines(doc, host, lines) {
+  lines.forEach((line, li) => {
+    const lineHost = createEl(doc, "span", void 0, {
+      display: "inline-block",
+      whiteSpace: "nowrap"
+    });
+    for (const piece of line.pieces) {
+      if (piece.leaderStyle) {
+        const leader = createEl(doc, "span", void 0, piece.leaderStyle);
+        leader.setAttribute("aria-hidden", "true");
+        leader.textContent = piece.leaderText ?? "";
+        lineHost.appendChild(leader);
+      }
+      for (const word of piece.words ?? [piece]) {
+        const textSpan = createEl(doc, "span", void 0, word.style);
+        textSpan.textContent = word.text;
+        lineHost.appendChild(textSpan);
+      }
+    }
+    host.appendChild(lineHost);
+    if (li < lines.length - 1) {
+      host.appendChild(doc.createElement("br"));
+    }
+  });
+}
+function appendStyledPieces(doc, host, pieces) {
+  for (const piece of pieces) {
+    if (piece.style) {
+      const span = createEl(doc, "span", void 0, piece.style);
+      span.textContent = piece.text;
+      host.appendChild(span);
+    } else {
+      host.appendChild(doc.createTextNode(piece.text));
+    }
+  }
+}
+
+// src/pptx/dom/elements/text-block.ts
+var NEWLINE_RUN = "\n";
+function createRunBaseNode(doc, run) {
+  if (run.equation) {
+    const host = createEl(doc, "span", "pptxv-inline-equation", run.style);
+    const math = createEl(doc, "span", "pptxv-equation-math", {
+      display: "inline-block",
+      verticalAlign: "middle",
+      fontFamily: "'Cambria Math', 'STIX Two Math', serif"
+    });
+    math.innerHTML = runEquationMathMl(run.equation);
+    host.appendChild(math);
+    if (run.equation.number) {
+      const number = createEl(doc, "span", "pptxv-equation-number", {
+        whiteSpace: "nowrap",
+        marginInlineStart: "0.5em"
+      });
+      number.textContent = `(${run.equation.number})`;
+      host.appendChild(number);
+    }
+    return host;
+  }
+  if (run.hyperlink?.href) {
+    const link = createEl(doc, "a", "pptxv-link", run.style);
+    link.setAttribute("href", run.hyperlink.href);
+    link.setAttribute("target", run.hyperlink.target ?? "_blank");
+    link.setAttribute("rel", run.hyperlink.rel ?? "noopener noreferrer");
+    if (run.hyperlink.tooltip) {
+      link.setAttribute("title", run.hyperlink.tooltip);
+    }
+    appendRunContent(doc, link, run);
+    return link;
+  }
+  if (run.ruby) {
+    const ruby = doc.createElement("ruby");
+    applyStyleMap(ruby, run.style);
+    appendRunContent(doc, ruby, run);
+    const openParen = doc.createElement("rp");
+    openParen.textContent = "(";
+    ruby.appendChild(openParen);
+    const annotation = doc.createElement("rt");
+    applyStyleMap(annotation, run.ruby.style);
+    annotation.textContent = run.ruby.text;
+    ruby.appendChild(annotation);
+    const closeParen = doc.createElement("rp");
+    closeParen.textContent = ")";
+    ruby.appendChild(closeParen);
+    return ruby;
+  }
+  const span = createEl(doc, "span");
+  applyStyleMap(span, run.style);
+  appendRunContent(doc, span, run);
+  return span;
+}
+function createRunNode(doc, run) {
+  const base = createRunBaseNode(doc, run);
+  if (!run.reflection) {
+    return base;
+  }
+  const wrapper = createEl(doc, "span", void 0, {
+    position: "relative",
+    display: "inline-block"
+  });
+  wrapper.appendChild(base);
+  const mirror = createEl(doc, "span", "pptxv-text-reflection", { ...run.reflection });
+  mirror.setAttribute("aria-hidden", "true");
+  const mirrorInner = createEl(doc, "span");
+  applyStyleMap(mirrorInner, run.style);
+  appendRunContent(doc, mirrorInner, run);
+  mirror.appendChild(mirrorInner);
+  wrapper.appendChild(mirror);
+  return wrapper;
+}
+function renderTextBlock(doc, paragraphs, textStyle, build) {
+  const block = createEl(doc, "div", "pptxv-text", textStyle);
+  for (const para of paragraphs) {
+    const paraStyle = {
+      // This paragraph's own `text-align` / BiDi `direction` / kinsoku rules,
+      // when it overrides the body's. Spread first so the explicit geometry
+      // below always wins.
+      ...para.paragraphStyle,
+      margin: 0,
+      marginLeft: para.marginLeftPx !== void 0 ? `${para.marginLeftPx}px` : 0
+    };
+    if (para.lineHeight !== void 0) {
+      paraStyle.lineHeight = para.lineHeight;
+    }
+    if (para.spaceBeforePx !== void 0) {
+      paraStyle.marginTop = `${para.spaceBeforePx}px`;
+    }
+    if (para.spaceAfterPx !== void 0) {
+      paraStyle.marginBottom = `${para.spaceAfterPx}px`;
+    }
+    if (para.strutFontSizePx !== void 0) {
+      paraStyle.fontSize = `${para.strutFontSizePx}px`;
+    }
+    const p = createEl(doc, "p", "pptxv-para", paraStyle);
+    if (para.textIndentPx !== void 0) {
+      p.style.textIndent = `${para.textIndentPx}px`;
+    }
+    const picture = para.bulletPicture;
+    if (picture?.src) {
+      const image = createEl(doc, "img", "pptxv-bullet-image", {
+        width: `${picture.sizePx}px`,
+        height: `${picture.sizePx}px`,
+        display: "inline-block",
+        verticalAlign: "middle",
+        marginInlineEnd: "4px",
+        objectFit: "contain"
+      });
+      image.src = picture.src;
+      image.alt = picture.accessibleLabel;
+      p.appendChild(image);
+    } else if (para.bulletMarker !== void 0) {
+      const bullet = createEl(doc, "span", "pptxv-bullet");
+      applyStyleMap(bullet, para.bulletStyle);
+      if (para.bulletPicture) {
+        bullet.setAttribute("aria-label", para.bulletPicture.accessibleLabel);
+      }
+      bullet.textContent = para.bulletMarker;
+      p.appendChild(bullet);
+    }
+    const spec = build ? buildTextBuildSpec(
+      build.elementId,
+      paragraphs.indexOf(para),
+      para.runs.filter((run) => run.text !== NEWLINE_RUN).map((run) => ({ text: run.text, style: run.style })),
+      build.states
+    ) : void 0;
+    if (spec && spec.granularity !== "paragraph") {
+      for (const span of spec.spans ?? []) {
+        const node = createEl(doc, "span");
+        applyStyleMap(node, { ...span.style ?? {}, ...textBuildSpanStyle(span) });
+        if (span.animId) {
+          node.setAttribute("data-anim-id", span.animId);
+        }
+        node.textContent = span.text;
+        p.appendChild(node);
+      }
+      block.appendChild(p);
+      continue;
+    }
+    let runHost = p;
+    if (spec) {
+      const wrapper = createEl(doc, "span");
+      applyStyleMap(wrapper, textBuildSpanStyle(spec));
+      if (spec.animId) {
+        wrapper.setAttribute("data-anim-id", spec.animId);
+      }
+      p.appendChild(wrapper);
+      runHost = wrapper;
+    }
+    for (const run of para.runs) {
+      if (run.text === NEWLINE_RUN) {
+        runHost.appendChild(doc.createElement("br"));
+        continue;
+      }
+      runHost.appendChild(createRunNode(doc, run));
+    }
+    if (para.isEmpty) {
+      runHost.appendChild(doc.createElement("br"));
+    }
+    block.appendChild(p);
+  }
+  return block;
+}
+
+// src/pptx/dom/elements/connector.ts
+var renderConnectorElement = (element, zIndex, context) => {
+  const doc = context.document;
+  const ss = hasShapeProperties(element) ? element.shapeStyle : void 0;
+  const strokeWidth = Math.max(0, ss?.strokeWidth ?? 2);
+  const strokeColor = ss?.strokeColor ?? DEFAULT_STROKE_COLOR;
+  const strokeOpacity = ss?.strokeOpacity ?? 1;
+  const dashArray = buildDashArray(ss?.strokeDash, strokeWidth, ss?.customDashSegments);
+  const w = Math.max(element.width, 1);
+  const h = Math.max(element.height, 1);
+  const wrapper = createEl(doc, "div", "pptxv-element pptxv-connector", {
+    position: "absolute",
+    left: `${element.x}px`,
+    top: `${element.y}px`,
+    width: `${element.width}px`,
+    height: `${element.height}px`,
+    zIndex,
+    pointerEvents: "none",
+    overflow: "visible",
+    // Base stroke colour lives on the wrapper (an inherited SVG property) so a
+    // `p:animClr` `stroke.color` keyframe applied to this `[data-element-id]`
+    // wrapper cascades down to the painted `stroke: inherit` strands below.
+    stroke: strokeColor
+  });
+  wrapper.dataset.elementId = element.id;
+  if (element.rotation) {
+    wrapper.style.transform = `rotate(${element.rotation}deg)`;
+  }
+  if (typeof element.opacity === "number") {
+    wrapper.style.opacity = String(element.opacity);
+  }
+  if (element.hidden) {
+    wrapper.style.display = "none";
+  }
+  const lineGlow = getLineGlowFilterCss(ss);
+  if (lineGlow) {
+    wrapper.style.filter = lineGlow;
+  }
+  const svg = createSvgEl(doc, "svg", { width: w, height: h, viewBox: `0 0 ${w} ${h}` });
+  svg.setAttribute("style", "overflow:visible;display:block");
+  const seed = element.id.replace(/[^a-zA-Z0-9_-]/gu, "_");
+  const defs = createSvgEl(doc, "defs");
+  const lineShadow = getLineShadowParams(ss);
+  const shadowId = lineShadow ? `${seed}-line-shadow` : void 0;
+  if (lineShadow && shadowId) {
+    const filter = createSvgEl(doc, "filter", {
+      id: shadowId,
+      x: "-50%",
+      y: "-50%",
+      width: "200%",
+      height: "200%"
+    });
+    filter.appendChild(
+      createSvgEl(doc, "feDropShadow", {
+        dx: lineShadow.offsetX,
+        dy: lineShadow.offsetY,
+        stdDeviation: lineShadow.blur / 2,
+        "flood-color": lineShadow.color,
+        "flood-opacity": lineShadow.opacity
+      })
+    );
+    defs.appendChild(filter);
+  }
+  const startArrow = normalizeArrow(ss?.connectorStartArrow);
+  const endArrow = normalizeArrow(ss?.connectorEndArrow);
+  const startMarkerId = startArrow ? `${seed}-start` : void 0;
+  const endMarkerId = endArrow ? `${seed}-end` : void 0;
+  if (startArrow && startMarkerId) {
+    defs.appendChild(
+      buildMarker(context, startMarkerId, startArrow, strokeColor, {
+        width: ss?.connectorStartArrowWidth,
+        length: ss?.connectorStartArrowLength
+      })
+    );
+  }
+  if (endArrow && endMarkerId) {
+    defs.appendChild(
+      buildMarker(context, endMarkerId, endArrow, strokeColor, {
+        width: ss?.connectorEndArrowWidth,
+        length: ss?.connectorEndArrowLength
+      })
+    );
+  }
+  if (defs.childNodes.length > 0) {
+    svg.appendChild(defs);
+  }
+  const compound = ss?.compoundLine;
+  const offsets = getCompoundLineOffsets(compound, strokeWidth);
+  const widths = getCompoundLineWidths(compound, strokeWidth);
+  const shapeType = hasShapeProperties(element) ? element.shapeType : void 0;
+  const usePath = connectorNeedsPath(shapeType) && hasShapeProperties(element);
+  const pathData = usePath ? getConnectorPathGeometry(element).pathData : void 0;
+  const x1 = element.flipHorizontal ? w : 0;
+  const y1 = element.flipVertical ? h : 0;
+  const x2 = element.flipHorizontal ? 0 : w;
+  const y2 = element.flipVertical ? 0 : h;
+  const hit = createSvgEl(doc, "path", {
+    class: "pptxv-connector-hit",
+    d: pathData ?? `M${x1},${y1} L${x2},${y2}`,
+    fill: "none",
+    stroke: "transparent",
+    "stroke-width": connectorHitStrokeWidth(strokeWidth),
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round"
+  });
+  hit.style.pointerEvents = "stroke";
+  svg.appendChild(hit);
+  offsets.forEach((offset, idx) => {
+    const stroke = {
+      // Inherit the wrapper's base stroke so a colour animation cascades.
+      stroke: "inherit",
+      "stroke-width": Math.max(widths[idx] ?? strokeWidth, 1),
+      "stroke-opacity": strokeOpacity,
+      "stroke-dasharray": dashArray,
+      "stroke-linecap": "round",
+      "marker-start": idx === 0 && startMarkerId ? `url(#${startMarkerId})` : void 0,
+      "marker-end": idx === offsets.length - 1 && endMarkerId ? `url(#${endMarkerId})` : void 0,
+      filter: shadowId ? `url(#${shadowId})` : void 0
+    };
+    let node;
+    if (pathData !== void 0) {
+      node = createSvgEl(doc, "path", {
+        d: pathData,
+        fill: "none",
+        "stroke-linejoin": "round",
+        ...stroke
+      });
+      if (offset !== 0) {
+        node.style.transform = `translate(0, ${offset}px)`;
+      }
+    } else {
+      node = createSvgEl(doc, "line", {
+        x1,
+        y1: y1 + offset,
+        x2,
+        y2: y2 + offset,
+        ...stroke
+      });
+    }
+    svg.appendChild(node);
+  });
+  wrapper.appendChild(svg);
+  appendConnectorLabel(wrapper, element, context);
+  return wrapper;
+};
+function appendConnectorLabel(wrapper, element, context) {
+  if (!hasTextProperties(element)) {
+    return;
+  }
+  const paragraphs = buildParagraphs(element, context.fieldContext);
+  if (!paragraphs.some((paragraph) => paragraph.runs.length > 0)) {
+    return;
+  }
+  const label = renderTextBlock(context.document, paragraphs, {
+    ...getTextBlockStyle(element),
+    position: "absolute",
+    left: "10%",
+    top: "50%",
+    width: "80%",
+    height: "auto",
+    transform: "translateY(-50%)",
+    textAlign: element.textStyle?.align ?? "center",
+    pointerEvents: "none"
+  });
+  label.classList.add("pptxv-connector-label");
+  wrapper.appendChild(label);
+}
+function buildMarker(context, id, arrow, strokeColor, size) {
+  const doc = context.document;
+  const shape = markerPath(arrow, size.width, size.length);
+  const marker = createSvgEl(doc, "marker", {
+    id,
+    viewBox: "0 0 10 10",
+    refX: 5,
+    refY: 5,
+    markerWidth: shape.markerWidth,
+    markerHeight: shape.markerHeight,
+    orient: "auto-start-reverse",
+    markerUnits: "strokeWidth"
+  });
+  if (shape.shape === "circle") {
+    marker.appendChild(createSvgEl(doc, "circle", { cx: 5, cy: 5, r: 4, fill: strokeColor }));
+  } else if (shape.strokeOnly) {
+    marker.appendChild(createSvgEl(doc, "path", { d: shape.d, fill: "none", stroke: strokeColor }));
+  } else {
+    marker.appendChild(createSvgEl(doc, "path", { d: shape.d, fill: strokeColor }));
+  }
+  return marker;
+}
+
+// src/pptx/dom/elements/ink-stroke-svg.ts
+function buildStrokeSvg(doc, view, replay) {
+  if (view.nibMarks) {
+    const g = createSvgEl(doc, "g", {
+      opacity: view.opacity,
+      ...view.blendMode === "multiply" ? { style: "mix-blend-mode: multiply" } : {}
+    });
+    for (const m of view.nibMarks) {
+      g.appendChild(
+        createSvgEl(doc, "ellipse", {
+          cx: m.cx,
+          cy: m.cy,
+          rx: m.rPerp,
+          ry: m.rTilt,
+          transform: `rotate(${m.rotationDeg} ${m.cx} ${m.cy})`,
+          fill: view.color
+        })
+      );
+    }
+    return g;
+  }
+  if (view.circles) {
+    const g = createSvgEl(doc, "g", {
+      opacity: view.opacity,
+      ...view.blendMode === "multiply" ? { style: "mix-blend-mode: multiply" } : {}
+    });
+    for (const c of view.circles) {
+      g.appendChild(createSvgEl(doc, "circle", { cx: c.cx, cy: c.cy, r: c.r, fill: view.color }));
+    }
+    return g;
+  }
+  const path = createSvgEl(doc, "path", {
+    d: view.d,
+    fill: "none",
+    stroke: view.color,
+    "stroke-width": view.width,
+    "stroke-opacity": view.opacity,
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round",
+    "vector-effect": "non-scaling-stroke",
+    "stroke-dasharray": replay?.strokeDasharray,
+    "stroke-dashoffset": replay?.strokeDashoffset
+  });
+  if (replay) {
+    path.style.animation = replay.animation;
+    path.style.setProperty("--ink-path-length", String(replay.pathLength));
+  }
+  if (view.blendMode === "multiply") {
+    path.style.mixBlendMode = "multiply";
+  }
+  return path;
+}
+
+// src/pptx/dom/elements/contentpart.ts
+var renderContentPartElement = (element, zIndex, context) => {
+  if (element.type !== "contentPart") {
+    return null;
+  }
+  const doc = context.document;
+  const el = createEl(
+    doc,
+    "div",
+    "pptxv-element pptxv-contentpart",
+    getContainerStyle(element, zIndex)
+  );
+  el.dataset.elementId = element.id;
+  const strokes = element.inkStrokes;
+  if (!strokes || strokes.length === 0) {
+    el.classList.add("pptxv-placeholder");
+    const label = createEl(doc, "div", "pptxv-placeholder-label");
+    label.textContent = context.t("pptx.ink.contentPartFallback");
+    el.appendChild(label);
+    return el;
+  }
+  const w = Math.max(element.width, 1);
+  const h = Math.max(element.height, 1);
+  const svg = createSvgEl(doc, "svg", {
+    viewBox: `0 0 ${w} ${h}`,
+    preserveAspectRatio: "none"
+  });
+  svg.setAttribute("class", "pptxv-contentpart-svg");
+  svg.setAttribute("style", "width:100%;height:100%;pointer-events:none;display:block");
+  const replayStyles = context.presenting ? getContentPartReplayStyles(strokes) : [];
+  if (context.presenting) {
+    const keyframes = createSvgEl(doc, "style");
+    keyframes.textContent = INK_REPLAY_KEYFRAMES;
+    svg.appendChild(keyframes);
+  }
+  const views = buildContentPartStrokes(element);
+  for (const [index, view] of views.entries()) {
+    svg.appendChild(buildStrokeSvg(doc, view, replayStyles[index]));
+  }
+  el.appendChild(svg);
+  return el;
+};
+function renderEquations(element, context) {
+  if (!hasTextProperties(element) || !isEquationOnlyText(element.textSegments)) {
+    return null;
+  }
+  const equations = (element.textSegments ?? []).filter((segment) => segment.equationXml);
+  if (equations.length === 0) {
+    return null;
+  }
+  const wrapper = createEl(context.document, "div", "pptxv-equations", {
+    ...getTextBlockStyle(element),
+    alignItems: "center",
+    gap: "0.25em",
+    fontFamily: "'Cambria Math', 'STIX Two Math', serif"
+  });
+  for (const segment of equations) {
+    const mathml = convertOmmlToMathMl(segment.equationXml);
+    if (!mathml) {
+      continue;
+    }
+    const row = createEl(context.document, "span", "pptxv-equation", {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      width: "100%"
+    });
+    const math = createEl(context.document, "span", "pptxv-equation-math", {
+      flex: 1,
+      textAlign: "center"
+    });
+    math.innerHTML = sanitizeMathMl(mathml);
+    row.appendChild(math);
+    if (segment.equationNumber) {
+      const number = createEl(context.document, "span", "pptxv-equation-number", {
+        whiteSpace: "nowrap"
+      });
+      number.textContent = `(${segment.equationNumber})`;
+      row.appendChild(number);
+    }
+    wrapper.appendChild(row);
+  }
+  return wrapper.childNodes.length > 0 ? wrapper : null;
+}
+function renderExtrusionOverlay(doc, element) {
+  if (!hasShapeProperties(element)) {
+    return null;
+  }
+  const fill = getComputedFillStyle(element)?.backgroundColor;
+  const data = build3DExtrusionData(
+    element.shapeStyle?.shape3d,
+    element.shapeStyle?.scene3d,
+    fill,
+    element.width,
+    element.height
+  );
+  if (!data.hasExtrusion || data.panels.length === 0) {
+    return null;
+  }
+  const wrapper = createEl(doc, "div", "pptxv-extrusion-3d", toCss(data.wrapperStyle));
+  wrapper.setAttribute("aria-hidden", "true");
+  for (const panel of data.panels) {
+    wrapper.appendChild(
+      createEl(
+        doc,
+        "div",
+        `pptxv-extrusion-3d-panel pptxv-extrusion-3d-panel--${panel.side}`,
+        toCss(panel.style)
+      )
+    );
+  }
+  if (data.materialOverlay) {
+    wrapper.appendChild(
+      createEl(doc, "div", "pptxv-extrusion-3d-material", {
+        position: "absolute",
+        inset: 0,
+        backgroundImage: data.materialOverlay,
+        pointerEvents: "none",
+        borderRadius: "inherit",
+        transform: String(data.frontFaceStyle.transform ?? "")
+      })
+    );
+  }
+  return wrapper;
+}
+function toCss(style) {
+  return Object.fromEntries(
+    Object.entries(style).map(([key, value]) => [
+      key,
+      typeof value === "number" ? `${value}px` : value
+    ])
+  );
+}
+function applyInheritedFill(node, fill) {
+  if (fill.backgroundColor !== void 0) {
+    node.style.backgroundColor = fill.backgroundColor;
+  }
+  if (fill.backgroundImage !== void 0) {
+    node.style.backgroundImage = fill.backgroundImage;
+  }
+  if (fill.backgroundRepeat !== void 0) {
+    node.style.backgroundRepeat = fill.backgroundRepeat;
+  }
+  if (fill.backgroundSize !== void 0) {
+    node.style.backgroundSize = fill.backgroundSize;
+  }
+}
+function appendOwnReflection(doc, host, element, mediaDataUrls, suppressOwnReflection) {
+  if (suppressOwnReflection) {
+    return;
+  }
+  const wrapperStyle = getComputedEffectStyle(element).reflection;
+  if (!wrapperStyle) {
+    return;
+  }
+  const layer = createEl(doc, "div", "pptxv-reflection", { ...wrapperStyle });
+  layer.setAttribute("aria-hidden", "true");
+  layer.appendChild(buildReflectionMirrorContent(doc, element, mediaDataUrls, void 0, true));
+  host.appendChild(layer);
+}
+function buildReflectionMirrorContent(doc, element, mediaDataUrls, parentGroupFill, suppressOwnReflection = false) {
+  if (element.type === "group") {
+    const wrap = createEl(doc, "div", void 0, {
+      position: "relative",
+      width: "100%",
+      height: "100%",
+      // A group paints no fill/outline of its own, but `p:grpSpPr/a:effectLst`
+      // DOES carry a shadow/glow/soft-edge for the group's own composite
+      // raster (see shared `getComputedEffectStyle`).
+      ...getShapeFillStrokeStyle(element)
+    });
+    const groupFilterDefs = renderShapeFilterDefs(doc, element);
+    if (groupFilterDefs) {
+      wrap.appendChild(groupFilterDefs);
+    }
+    const childParentFill = getGroupChildParentFill(element, parentGroupFill);
+    for (const child of element.children ?? []) {
+      const childWrap = createEl(doc, "div", void 0, getContainerStyle(child, 0));
+      childWrap.appendChild(
+        buildReflectionMirrorContent(doc, child, mediaDataUrls, childParentFill)
+      );
+      wrap.appendChild(childWrap);
+    }
+    appendOwnReflection(doc, wrap, element, mediaDataUrls, suppressOwnReflection);
+    return wrap;
+  }
+  const box = createEl(doc, "div", void 0, {
+    width: "100%",
+    height: "100%",
+    ...getShapeFillStrokeStyle(element)
+  });
+  const inheritedFill = resolveGroupChildFill(element, parentGroupFill);
+  if (inheritedFill) {
+    applyInheritedFill(box, inheritedFill);
+  }
+  const subpathFill = renderShapeSubpathFillOverlay(doc, element);
+  if (subpathFill) {
+    box.appendChild(subpathFill);
+  }
+  const filterDefs = renderShapeFilterDefs(doc, element);
+  if (filterDefs) {
+    box.appendChild(filterDefs);
+  }
+  const fillOverlay = renderShapeFillOverlay(doc, element);
+  if (fillOverlay) {
+    box.appendChild(fillOverlay);
+  }
+  const gradientOutline = renderStrokeOutline(doc, element);
+  if (gradientOutline) {
+    box.appendChild(gradientOutline);
+  }
+  if (isImageLikeElement(element)) {
+    const src = getImageSrc(element, new Map(mediaDataUrls));
+    if (src) {
+      const img = createEl(doc, "img", void 0, {
+        width: "100%",
+        height: "100%",
+        ...getImageFitStyle(element)
+      });
+      img.setAttribute("src", src);
+      img.setAttribute("alt", "");
+      img.setAttribute("draggable", "false");
+      box.appendChild(img);
+    }
+    appendOwnReflection(doc, box, element, mediaDataUrls, suppressOwnReflection);
+    return box;
+  }
+  const paragraphs = buildParagraphs(element);
+  const hasText = paragraphs.some((p) => p.runs.length > 0 || p.bulletMarker !== void 0);
+  if (hasText) {
+    box.appendChild(renderTextBlock(doc, paragraphs, getTextBlockStyle(element)));
+  }
+  appendOwnReflection(doc, box, element, mediaDataUrls, suppressOwnReflection);
+  return box;
+}
+
+// src/pptx/dom/elements/shape-filter-defs.ts
+var OUTLINE_SVG_STYLE = "position:absolute;inset:0;width:100%;height:100%;min-width:1px;min-height:1px;overflow:visible;pointer-events:none";
+function renderShapeFilterDefs(doc, element) {
+  const style = getEffectStyleSource(element);
+  if (!style) {
+    return null;
+  }
+  const markups = [];
+  const duotone = getDuotoneSvgFilter(style, element.id);
+  if (duotone) {
+    markups.push(duotone.filterMarkup);
+  }
+  const softEdge = getSoftEdgeSvgFilter(style, element.id);
+  if (softEdge) {
+    markups.push(softEdge.filterMarkup);
+  }
+  const bevelLighting = getBevelLightingSvgFilter(element);
+  if (bevelLighting) {
+    markups.push(bevelLighting.filterMarkup);
+  }
+  if (markups.length === 0) {
+    return null;
+  }
+  const svg = createSvgEl(doc, "svg", { width: 0, height: 0, "aria-hidden": "true" });
+  svg.setAttribute("style", "position:absolute;width:0;height:0;overflow:hidden");
+  const defs = createSvgEl(doc, "defs");
+  defs.innerHTML = markups.join("");
+  svg.appendChild(defs);
+  return svg;
+}
+function renderShapeFillOverlay(doc, element) {
+  if (!hasShapeProperties(element)) {
+    return null;
+  }
+  const overlay = getComputedEffectStyle(element).fillOverlay;
+  if (!overlay) {
+    return null;
+  }
+  const layer = createEl(doc, "div", "pptxv-fill-overlay", {
+    position: "absolute",
+    inset: 0,
+    background: overlay.color,
+    mixBlendMode: overlay.blendMode,
+    pointerEvents: "none"
+  });
+  layer.setAttribute("aria-hidden", "true");
+  return layer;
+}
+function renderReflectionOverlay(doc, element, mediaDataUrls) {
+  const wrapperStyle = getComputedEffectStyle(element).reflection;
+  if (!wrapperStyle) {
+    return null;
+  }
+  const layer = createEl(doc, "div", "pptxv-reflection", { ...wrapperStyle });
+  layer.setAttribute("aria-hidden", "true");
+  layer.appendChild(buildReflectionMirrorContent(doc, element, mediaDataUrls, void 0, true));
+  return layer;
+}
+function renderHollowHitOutline(doc, element) {
+  const hit = buildHollowHitOutline(element);
+  if (!hit) {
+    return null;
+  }
+  const svg = createSvgEl(doc, "svg", {
+    "aria-hidden": "true",
+    viewBox: strokeOutlineViewBox(element),
+    preserveAspectRatio: "none"
+  });
+  svg.setAttribute("style", OUTLINE_SVG_STYLE);
+  const path = createSvgEl(doc, "path", {
+    d: hit.d,
+    fill: "none",
+    stroke: "transparent",
+    "stroke-width": hit.strokeWidth
+  });
+  path.setAttribute("style", "pointer-events:stroke");
+  svg.appendChild(path);
+  return svg;
+}
+function renderShapeSubpathFillOverlay(doc, element) {
+  const overlay = buildSubpathFillOverlay(element);
+  if (!overlay) {
+    return null;
+  }
+  const svg = createSvgEl(doc, "svg", {
+    class: "pptx-vanilla-subpath-fill",
+    "aria-hidden": "true",
+    viewBox: `0 0 ${overlay.viewBoxWidth} ${overlay.viewBoxHeight}`,
+    preserveAspectRatio: "none"
+  });
+  svg.setAttribute("style", "position:absolute;inset:0;width:100%;height:100%");
+  for (const paint of overlay.paints) {
+    const path = createSvgEl(doc, "path", { d: paint.d, fill: paint.fill, stroke: "none" });
+    svg.appendChild(path);
+  }
+  return svg;
+}
+function renderStrokeOutline(doc, element) {
+  const outline = buildStrokeOutline(element);
+  if (!outline) {
+    return null;
+  }
+  const svg = createSvgEl(doc, "svg", {
+    class: "pptx-vanilla-gradient-outline",
+    "aria-hidden": "true",
+    viewBox: strokeOutlineViewBox(element),
+    preserveAspectRatio: "none"
+  });
+  svg.setAttribute("style", OUTLINE_SVG_STYLE);
+  if (outline.paint) {
+    const defs = createSvgEl(doc, "defs");
+    if (isPatternPaint(outline.paint)) {
+      const pattern = createSvgEl(doc, "pattern", {
+        id: outline.paint.id,
+        width: outline.paint.width,
+        height: outline.paint.height,
+        patternUnits: "userSpaceOnUse"
+      });
+      const image = createSvgEl(doc, "image", {
+        href: outline.paint.href,
+        width: outline.paint.width,
+        height: outline.paint.height
+      });
+      pattern.appendChild(image);
+      defs.appendChild(pattern);
+    } else {
+      defs.innerHTML = svgGradientMarkup(outline.paint);
+    }
+    svg.appendChild(defs);
+  }
+  for (const strand of outline.strands) {
+    const path = createSvgEl(doc, "path", {
+      d: outline.d,
+      fill: "none",
+      stroke: outline.stroke,
+      "stroke-width": strand.strokeWidth,
+      "stroke-linecap": outline.lineCap,
+      "stroke-linejoin": outline.lineJoin
+    });
+    if (outline.dashArray) {
+      path.setAttribute("stroke-dasharray", outline.dashArray);
+    }
+    if (strand.offset !== 0) {
+      path.setAttribute("style", `transform:translate(0, ${strand.offset}px)`);
+    }
+    svg.appendChild(path);
+  }
+  return svg;
+}
+
+// src/pptx/dom/elements/group.ts
+function applyGroupChildFill(node, fill) {
+  if (fill.backgroundColor !== void 0) {
+    node.style.backgroundColor = fill.backgroundColor;
+  }
+  if (fill.backgroundImage !== void 0) {
+    node.style.backgroundImage = fill.backgroundImage;
+  }
+  if (fill.backgroundRepeat !== void 0) {
+    node.style.backgroundRepeat = fill.backgroundRepeat;
+  }
+  if (fill.backgroundSize !== void 0) {
+    node.style.backgroundSize = fill.backgroundSize;
+  }
+}
+function indexRenderedNodes(root) {
+  const byId = /* @__PURE__ */ new Map();
+  for (const node of root.querySelectorAll("[data-element-id]")) {
+    const id = node.dataset.elementId;
+    if (id !== void 0 && !byId.has(id)) {
+      byId.set(id, node);
+    }
+  }
+  return byId;
+}
+function paintInheritedFill(node, element, parentGroupFill) {
+  const inherited = resolveGroupChildFill(element, parentGroupFill);
+  if (inherited) {
+    applyGroupChildFill(node, inherited);
+  }
+  if (element.type !== "group") {
+    return;
+  }
+  const childFill = getGroupChildParentFill(element, parentGroupFill);
+  if (!childFill) {
+    return;
+  }
+  const byId = indexRenderedNodes(node);
+  for (const grandchild of element.children) {
+    const grandchildNode = byId.get(grandchild.id);
+    if (grandchildNode) {
+      paintInheritedFill(grandchildNode, grandchild, childFill);
+    }
+  }
+}
+var renderGroupElement = (element, zIndex, context) => {
+  const el = createEl(context.document, "div", "pptxv-element pptxv-group", {
+    ...getContainerStyle(element, zIndex),
+    // A group paints no fill/outline of its own, but `p:grpSpPr/a:effectLst`
+    // DOES carry a shadow/glow/soft-edge for the group's own composite
+    // raster (see shared `getComputedEffectStyle`), expressed as `filter` /
+    // `overflow` here.
+    ...getShapeFillStrokeStyle(element)
+  });
+  el.dataset.elementId = element.id;
+  const filterDefs = renderShapeFilterDefs(context.document, element);
+  if (filterDefs) {
+    el.appendChild(filterDefs);
+  }
+  const reflection = renderReflectionOverlay(context.document, element, context.mediaDataUrls);
+  if (reflection) {
+    el.appendChild(reflection);
+  }
+  if (element.type === "group" && element.children?.length) {
+    const parentGroupFill = getGroupChildParentFill(element);
+    element.children.forEach((child, index) => {
+      const childEl = context.renderElement(child, index);
+      if (childEl) {
+        paintInheritedFill(childEl, child, parentGroupFill);
+        el.appendChild(childEl);
+      }
+    });
+  }
+  return el;
+};
+
+// src/pptx/dom/elements/image.ts
+var renderImageElement = (element, zIndex, context) => {
+  const doc = context.document;
+  const geometry = element.type === "image" || element.type === "picture" ? resolveShapeGeometry(element) : void 0;
+  const geometryClipPath = geometry?.kind === "clipPath" ? geometry.clipPath : void 0;
+  const cropShapeClipPath = element.type === "image" || element.type === "picture" ? getCropShapeClipPath(element.cropShape, element.width, element.height) : void 0;
+  const el = createEl(doc, "div", "pptxv-element pptxv-image", {
+    ...getContainerStyle(element, zIndex),
+    overflow: getImageOverflow(element),
+    // The picture's own shape geometry (prstGeom / custGeom) clips the frame,
+    // not the `<img>` - a pixel-space clip on the img would be scaled and
+    // shifted by the crop transform.
+    ...geometry?.kind === "borderRadius" ? { borderRadius: geometry.radius } : {},
+    ...geometryClipPath ? { clipPath: geometryClipPath } : cropShapeClipPath ? { clipPath: cropShapeClipPath } : {}
+  });
+  el.dataset.elementId = element.id;
+  const src = getImageSrc(element, new Map(context.mediaDataUrls));
+  if (!src) {
+    return el;
+  }
+  const fx = getComputedImageStyle(element);
+  for (const f of fx.svgFilters) {
+    const svg = createSvgEl(doc, "svg", { width: 0, height: 0, "aria-hidden": "true" });
+    svg.setAttribute("style", "position:absolute;width:0;height:0;overflow:hidden");
+    const defs = createSvgEl(doc, "defs");
+    const filter = createSvgEl(doc, "filter");
+    setSvgAttrs(filter, { id: f.id, "color-interpolation-filters": "sRGB" });
+    filter.innerHTML = f.markup;
+    defs.appendChild(filter);
+    svg.appendChild(defs);
+    el.appendChild(svg);
+  }
+  const reflection = renderReflectionOverlay(doc, element, context.mediaDataUrls);
+  const tiling = getImageTilingStyle(element, getCachedNativeImageSize(src));
+  if (tiling) {
+    const tile = createEl(doc, "div", "pptxv-image-tile", tiling);
+    if (fx.filter) {
+      tile.style.filter = fx.filter;
+    }
+    if (fx.opacity !== void 0) {
+      tile.style.opacity = String(fx.opacity);
+    }
+    if (!getCachedNativeImageSize(src)) {
+      void probeNativeImageSize(src).then((size) => {
+        if (size) {
+          applyStyleMap(tile, getImageTilingStyle(element, size) ?? {});
+        }
+        return void 0;
+      });
+    }
+    el.appendChild(tile);
+    if (reflection) {
+      el.appendChild(reflection);
+    }
+    return el;
+  }
+  const fit = getImageFitStyle(element);
+  const fillCounterTransform = getImageFillCounterTransform(element, Boolean(fit.transform));
+  const img = createEl(doc, "img", void 0, {
+    ...fit,
+    display: "block",
+    ...fillCounterTransform ? { transform: fillCounterTransform, transformOrigin: "center" } : {}
+  });
+  img.src = src;
+  img.alt = "";
+  if (fx.filter) {
+    img.style.filter = fx.filter;
+  }
+  if (fx.opacity !== void 0) {
+    img.style.opacity = String(fx.opacity);
+  }
+  el.appendChild(img);
+  if (element.type === "image" || element.type === "picture") {
+    const clrChange = element.imageEffects?.clrChange;
+    if (clrChange) {
+      void resolveColorChangedImageSource(src, clrChange).then((resolved) => {
+        if (img.src === src || img.getAttribute("src") === src) {
+          img.src = resolved;
+        }
+        return void 0;
+      });
+    }
+    const wash = getImageColorWashStyle(element.imageEffects?.colorWash);
+    if (wash) {
+      el.appendChild(
+        createEl(doc, "div", "pptxv-image-color-wash", {
+          position: "absolute",
+          inset: "0",
+          pointerEvents: "none",
+          backgroundColor: wash.backgroundColor,
+          opacity: String(wash.opacity)
+        })
+      );
+    }
+  }
+  if (reflection) {
+    el.appendChild(reflection);
+  }
+  return el;
+};
+
+// src/pptx/dom/elements/ink.ts
+var renderInkElement = (element, zIndex, context) => {
+  if (element.type !== "ink") {
+    return null;
+  }
+  const doc = context.document;
+  const wrapper = createEl(
+    doc,
+    "div",
+    "pptxv-element pptxv-ink",
+    getContainerStyle(element, zIndex)
+  );
+  wrapper.dataset.elementId = element.id;
+  const paths = element.inkPaths;
+  if (paths.length === 0) {
+    return wrapper;
+  }
+  const w = Math.max(element.width, 1);
+  const h = Math.max(element.height, 1);
+  const svg = createSvgEl(doc, "svg", {
+    viewBox: `0 0 ${w} ${h}`,
+    preserveAspectRatio: "none"
+  });
+  svg.setAttribute("class", "pptxv-ink-svg");
+  svg.setAttribute("style", "width:100%;height:100%;pointer-events:none;display:block");
+  const replayStyles = context.presenting ? getInkReplayStyles(element) : [];
+  if (context.presenting) {
+    const keyframes = createSvgEl(doc, "style");
+    keyframes.textContent = INK_REPLAY_KEYFRAMES;
+    svg.appendChild(keyframes);
+  }
+  const views = buildInkGroupStrokes(element, { color: DEFAULT_STROKE_COLOR, width: 1 });
+  for (const [i, view] of views.entries()) {
+    svg.appendChild(buildStrokeSvg(doc, view, replayStyles[i]));
+  }
+  wrapper.appendChild(svg);
+  return wrapper;
+};
+
+// src/pptx/dom/elements/media-fullscreen-overlay.ts
+function mediaFullscreenResetStyle(baseStyle) {
+  return {
+    left: baseStyle["left"] ?? "",
+    top: baseStyle["top"] ?? "",
+    width: baseStyle["width"] ?? "",
+    height: baseStyle["height"] ?? "",
+    transform: typeof baseStyle["transform"] === "string" ? baseStyle["transform"] : "none",
+    zIndex: baseStyle["zIndex"] ?? "",
+    background: "",
+    transition: "",
+    borderColor: ""
+  };
+}
+function buildFullscreenStopButton(doc, label, onStop) {
+  const button = createEl(doc, "button", "pptxv-media-fullscreen-stop", {
+    position: "absolute",
+    bottom: "12px",
+    right: "12px",
+    zIndex: 30,
+    border: "none",
+    borderRadius: "9999px",
+    background: "rgba(0, 0, 0, 0.5)",
+    color: "rgba(255, 255, 255, 0.8)",
+    padding: "8px",
+    cursor: "pointer",
+    pointerEvents: "auto"
+  });
+  button.type = "button";
+  button.setAttribute("aria-label", label);
+  button.addEventListener("click", onStop);
+  const icon = createSvgEl(doc, "svg", {
+    width: 18,
+    height: 18,
+    viewBox: "0 0 24 24",
+    fill: "currentColor",
+    stroke: "none"
+  });
+  icon.appendChild(createSvgEl(doc, "rect", { x: 6, y: 6, width: 12, height: 12, rx: 1 }));
+  button.appendChild(icon);
+  return button;
+}
+function wireMediaFullscreenOverlay(doc, container, mediaNode, element, context, baseStyle) {
+  let stopButton = null;
+  const update = (playing) => {
+    const input = { fullScreen: element.fullScreen, presenting: context.presenting, playing };
+    const active = isMediaFullscreenActive(input);
+    applyStyleMap(
+      container,
+      active ? MEDIA_FULLSCREEN_OVERLAY_STYLE : mediaFullscreenResetStyle(baseStyle)
+    );
+    if (shouldShowMediaFullscreenStopButton(input)) {
+      if (!stopButton) {
+        stopButton = buildFullscreenStopButton(
+          doc,
+          context.t("pptx.media.stopFullscreenAria"),
+          () => {
+            if (!mediaNode.paused) {
+              mediaNode.pause();
+            }
+          }
+        );
+        container.appendChild(stopButton);
+      }
+    } else if (stopButton) {
+      stopButton.remove();
+      stopButton = null;
+    }
+  };
+  mediaNode.addEventListener("play", () => update(true));
+  mediaNode.addEventListener("pause", () => update(false));
+  mediaNode.addEventListener("ended", () => update(false));
+}
+
+// src/pptx/dom/elements/media.ts
+function applyMediaPresentingState(el, presenting, playback) {
+  applyMediaPlaybackAttributes(el, playback);
+  if (presenting) {
+    startMediaAutoplay(el, { trimStartMs: playback.trimStartMs });
+    scheduleMediaTrimAndFade(el, {
+      ...playback,
+      volume: mediaPlaybackAttributes(playback).volume
+    });
+  } else if (!el.paused) {
+    el.pause();
+  }
+}
+var renderMediaElement = (element, zIndex, context) => {
+  if (element.type !== "media") {
+    return null;
+  }
+  const surface = mediaSurfaceOf({
+    interactive: context.interactive === true || context.reading === true,
+    presenting: context.presenting
+  });
+  const showTransport = mediaTransportVisible({ ...surface, canvasTransport: true });
+  const doc = context.document;
+  const baseStyle = getContainerStyle(element, zIndex);
+  const el = createEl(doc, "div", "pptxv-element pptxv-media", baseStyle);
+  el.dataset.elementId = element.id;
+  const mediaSrc = element.mediaData ?? (element.mediaPath ? context.mediaDataUrls.get(element.mediaPath) : void 0);
+  const posterSrc = getImageSrc(element, new Map(context.mediaDataUrls));
+  const onlineVideoEmbedUrl = getOnlineVideoEmbed(element)?.embedUrl;
+  if (onlineVideoEmbedUrl && element.mediaType === "video") {
+    const iframe = createEl(doc, "iframe", "pptxv-media-video pptxv-media-iframe", {
+      width: "100%",
+      height: "100%",
+      border: "0",
+      display: "block"
+    });
+    iframe.src = onlineVideoEmbedUrl;
+    iframe.title = context.t("pptx.media.onlineVideoTitle");
+    iframe.allow = ONLINE_VIDEO_IFRAME_ALLOW;
+    iframe.sandbox.value = ONLINE_VIDEO_IFRAME_SANDBOX;
+    iframe.allowFullscreen = true;
+    el.appendChild(iframe);
+    return el;
+  }
+  if (mediaSrc && element.mediaType === "video") {
+    const video = createEl(doc, "video", "pptxv-media-video", {
+      width: "100%",
+      height: "100%",
+      objectFit: "contain",
+      display: "block"
+    });
+    video.src = mediaSrc;
+    video.controls = showTransport;
+    video.preload = "metadata";
+    video.playsInline = true;
+    if (posterSrc) {
+      video.setAttribute("poster", posterSrc);
+    }
+    el.appendChild(video);
+    applyMediaPresentingState(video, context.presenting, element);
+    wireMediaFullscreenOverlay(doc, el, video, element, context, baseStyle);
+    return el;
+  }
+  if (mediaSrc && element.mediaType === "audio") {
+    const audio = createEl(doc, "audio", "pptxv-media-audio", { width: "100%" });
+    audio.src = mediaSrc;
+    audio.controls = showTransport;
+    el.appendChild(audio);
+    if (context.presenting && registerCrossSlideAudio(element, mediaSrc)) {
+      audio.muted = true;
+      applyMediaPlaybackAttributes(audio, element);
+      return el;
+    }
+    applyMediaPresentingState(audio, context.presenting, element);
+    wireMediaFullscreenOverlay(doc, el, audio, element, context, baseStyle);
+    return el;
+  }
+  const fallback = mediaFallbackVisual(surface, {
+    hasPoster: Boolean(posterSrc),
+    missing: element.mediaMissing === true
+  });
+  const icon = mediaFallbackIcon(fallback, element.mediaType);
+  const labelKey = mediaFallbackLabelKey(fallback, element.mediaType);
+  if (fallback.poster && posterSrc) {
+    const img = createEl(doc, "img", "pptxv-media-poster", {
+      width: "100%",
+      height: "100%",
+      objectFit: "contain",
+      display: "block",
+      opacity: fallback.dimPoster ? "0.5" : ""
+    });
+    img.src = posterSrc;
+    img.alt = "";
+    el.appendChild(img);
+    if (fallback.badge !== "none") {
+      const badge = createEl(doc, "div", "pptxv-media-badge");
+      if (fallback.badge === "missing") {
+        badge.classList.add("pptxv-media-badge-missing");
+      }
+      badge.setAttribute(MEDIA_CHROME_ATTRIBUTE, fallback.badge);
+      badge.appendChild(buildIcon(doc, icon));
+      if (labelKey !== void 0 && fallback.badge === "missing") {
+        const text = createEl(doc, "span");
+        text.textContent = context.t(labelKey);
+        badge.appendChild(text);
+      }
+      el.appendChild(badge);
+    }
+    return el;
+  }
+  if (fallback.placeholder !== "none") {
+    el.classList.add("pptxv-placeholder", "pptxv-media-placeholder");
+    el.setAttribute(MEDIA_CHROME_ATTRIBUTE, fallback.placeholder);
+    if (icon.length > 0) {
+      el.appendChild(buildIcon(doc, icon));
+    }
+    if (labelKey !== void 0) {
+      const label = createEl(doc, "div", "pptxv-placeholder-label");
+      label.textContent = context.t(labelKey);
+      el.appendChild(label);
+    }
+  }
+  return el;
+};
+function buildIcon(doc, paths) {
+  const svg = doc.createElementNS("http://www.w3.org/2000/svg", "svg");
+  svg.setAttribute("viewBox", "0 0 24 24");
+  svg.setAttribute("fill", "none");
+  svg.setAttribute("stroke", "currentColor");
+  svg.setAttribute("stroke-width", "1.5");
+  for (const d of paths) {
+    const path = doc.createElementNS("http://www.w3.org/2000/svg", "path");
+    path.setAttribute("d", d);
+    svg.appendChild(path);
+  }
+  return svg;
+}
+
+// src/pptx/dom/elements/model3d.ts
+var renderModel3dElement = (element, zIndex, context) => {
+  if (element.type !== "model3d") {
+    return null;
+  }
+  const doc = context.document;
+  const el = createEl(
+    doc,
+    "div",
+    "pptxv-element pptxv-model3d",
+    getContainerStyle(element, zIndex)
+  );
+  el.dataset.elementId = element.id;
+  const label = context.t("pptx.model3d.label");
+  const posterSrc = element.posterImage ?? element.imageData;
+  const poster = posterSrc ? buildPoster(doc, posterSrc, label) : buildPlaceholder(doc, label);
+  el.appendChild(poster);
+  if (element.modelData) {
+    el.appendChild(buildViewButton(doc, el, poster, element, context));
+  }
+  return el;
+};
+function buildPoster(doc, src, alt) {
+  const img = createEl(doc, "img", "pptxv-model3d-poster", {
+    width: "100%",
+    height: "100%",
+    objectFit: "contain",
+    pointerEvents: "none",
+    userSelect: "none",
+    display: "block"
+  });
+  img.src = src;
+  img.alt = alt;
+  img.draggable = false;
+  return img;
+}
+function buildPlaceholder(doc, label) {
+  const box = createEl(doc, "div", "pptxv-model3d-placeholder", {
+    width: "100%",
+    height: "100%",
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    justifyContent: "center",
+    fontSize: "11px",
+    color: "#9ca3af",
+    backgroundColor: "#f9fafb",
+    border: "1px dashed #e5e7eb",
+    borderRadius: "4px",
+    boxSizing: "border-box"
+  });
+  const icon = createSvgEl(doc, "svg", {
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    "stroke-width": 1.5,
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round"
+  });
+  icon.setAttribute("class", "pptxv-model3d-icon");
+  icon.setAttribute("style", "margin-bottom:4px;color:#d1d5db");
+  icon.appendChild(
+    createSvgEl(doc, "path", {
+      d: "M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"
+    })
+  );
+  icon.appendChild(createSvgEl(doc, "polyline", { points: "3.27 6.96 12 12.01 20.73 6.96" }));
+  icon.appendChild(createSvgEl(doc, "line", { x1: 12, y1: 22.08, x2: 12, y2: 12 }));
+  box.appendChild(icon);
+  const text = createEl(doc, "span", "pptxv-model3d-label");
+  text.textContent = label;
+  box.appendChild(text);
+  return box;
+}
+function buildViewButton(doc, root, poster, element, context) {
+  const button = createEl(doc, "button", "pptxv-model3d-view", {
+    position: "absolute",
+    bottom: "4px",
+    right: "4px",
+    zIndex: 10,
+    padding: "2px 8px",
+    border: "1px solid rgba(0,0,0,0.18)",
+    borderRadius: "4px",
+    background: "rgba(255,255,255,0.9)",
+    color: "#1a1a1a",
+    font: "inherit",
+    fontSize: "11px",
+    lineHeight: 1.4,
+    cursor: "pointer",
+    pointerEvents: "auto"
+  });
+  button.type = "button";
+  const label = context.t("pptx.model3d.label");
+  button.textContent = label;
+  button.title = label;
+  button.setAttribute("aria-label", label);
+  for (const type of ["pointerdown", "mousedown"]) {
+    button.addEventListener(type, (event) => event.stopPropagation());
+  }
+  button.addEventListener("click", (event) => {
+    event.stopPropagation();
+    if (button.disabled) {
+      return;
+    }
+    button.disabled = true;
+    const url = modelDataToBlobUrl(element.modelData, element.modelMimeType);
+    if (!url) {
+      button.remove();
+      return;
+    }
+    const sceneHost = createEl(doc, "div", "pptxv-model3d-scene", {
+      position: "absolute",
+      inset: 0,
+      willChange: "transform"
+    });
+    root.appendChild(sceneHost);
+    void mountModel3D(sceneHost, url, {
+      width: Math.max(1, element.width),
+      height: Math.max(1, element.height),
+      interactive: true,
+      scene: element.scene
+    }).then((handle) => {
+      URL.revokeObjectURL(url);
+      if (handle.ok) {
+        poster.remove();
+        button.remove();
+      } else {
+        sceneHost.remove();
+        button.remove();
+      }
+      return void 0;
+    });
+  });
+  return button;
+}
+
+// src/pptx/dom/elements/ole-icons.ts
+function buildOleIcon(doc, type, color) {
+  const svg = createSvgEl(doc, "svg", {
+    width: 36,
+    height: 36,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    "aria-hidden": "true"
+  });
+  for (const shape of getOleIconShapes(type)) {
+    const node = createSvgEl(doc, shape.tag, shape.attrs);
+    if (shape.tag === "text") {
+      node.setAttribute("fill", color);
+      node.textContent = shape.text ?? "";
+    } else {
+      node.setAttribute("stroke", color);
+    }
+    svg.appendChild(node);
+  }
+  return svg;
+}
+
+// src/pptx/dom/elements/ole.ts
+var renderOleElement = (element, zIndex, context) => {
+  if (element.type !== "ole") {
+    return null;
+  }
+  const doc = context.document;
+  const oleType = resolveOleType(element);
+  const typeColor = getOleTypeColor(oleType);
+  const typeLabel = getOleTypeLabel(oleType);
+  const el = createEl(doc, "div", "pptxv-element pptxv-ole", getContainerStyle(element, zIndex));
+  el.dataset.elementId = element.id;
+  el.setAttribute("role", "group");
+  el.setAttribute("aria-label", getOleAriaLabel(element));
+  el.title = infoLines(element, typeLabel).join("\n");
+  if (element.previewImageData) {
+    el.appendChild(buildPreview(doc, element, typeColor, getOleBadgeLabel(oleType)));
+  } else {
+    el.appendChild(buildPlaceholder2(doc, element, oleType, typeColor, typeLabel));
+  }
+  const showActions = oleActionsVisible(
+    mediaSurfaceOf({
+      interactive: context.interactive === true,
+      presenting: context.presenting
+    })
+  );
+  if (element.oleEmbeddedData && showActions) {
+    el.appendChild(buildActionBar(doc, element, typeLabel, context));
+  }
+  return el;
+};
+function infoLines(el, typeLabel) {
+  const lines = [typeLabel];
+  const name = el.oleEmbeddedFileName ?? el.fileName;
+  if (name) {
+    lines.push(name);
+  }
+  const size = formatBytes(el.oleEmbeddedByteSize);
+  if (size) {
+    lines.push(size);
+  }
+  if (el.oleProgId) {
+    lines.push(el.oleProgId);
+  }
+  return lines;
+}
+function buildPreview(doc, el, typeColor, badgeLabel) {
+  const preview = createEl(doc, "div", "pptxv-ole-preview", {
+    position: "relative",
+    width: "100%",
+    height: "100%"
+  });
+  const img = createEl(doc, "img", "pptxv-ole-img", {
+    width: "100%",
+    height: "100%",
+    objectFit: "contain",
+    pointerEvents: "none",
+    userSelect: "none",
+    display: "block"
+  });
+  img.src = el.previewImageData ?? "";
+  img.alt = getOleAriaLabel(el);
+  img.draggable = false;
+  preview.appendChild(img);
+  const badge = createSvgEl(doc, "svg", { width: 24, height: 24, viewBox: "0 0 24 24" });
+  badge.setAttribute("class", "pptxv-ole-badge");
+  badge.setAttribute(
+    "style",
+    "position:absolute;bottom:4px;right:4px;z-index:10;pointer-events:none"
+  );
+  badge.appendChild(
+    createSvgEl(doc, "rect", { x: 2, y: 2, width: 20, height: 20, rx: 3, fill: typeColor })
+  );
+  const badgeText = createSvgEl(doc, "text", {
+    x: 12,
+    y: 16,
+    "text-anchor": "middle",
+    fill: "white",
+    "font-size": badgeLabel.length > 4 ? 6 : 10,
+    "font-weight": "bold"
+  });
+  badgeText.textContent = badgeLabel;
+  badge.appendChild(badgeText);
+  preview.appendChild(badge);
+  return preview;
+}
+function buildPlaceholder2(doc, el, oleType, typeColor, typeLabel) {
+  const box = createEl(doc, "div", "pptxv-ole-placeholder", {
+    ...getPlaceholderStyle(oleType),
+    width: "100%",
+    height: "100%",
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    justifyContent: "center",
+    pointerEvents: "none",
+    boxSizing: "border-box"
+  });
+  box.appendChild(buildOleIcon(doc, oleType, typeColor));
+  const name = createEl(doc, "span", "pptxv-ole-name", {
+    marginTop: "8px",
+    fontSize: "12px",
+    fontWeight: 500,
+    maxWidth: "90%",
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    whiteSpace: "nowrap",
+    color: typeColor
+  });
+  name.textContent = getOleDisplayName(el);
+  box.appendChild(name);
+  if (el.fileName) {
+    const sublabel = createEl(doc, "span", "pptxv-ole-sublabel", {
+      marginTop: "2px",
+      fontSize: "10px",
+      color: "rgba(0,0,0,0.45)",
+      maxWidth: "90%",
+      overflow: "hidden",
+      textOverflow: "ellipsis",
+      whiteSpace: "nowrap"
+    });
+    sublabel.textContent = typeLabel;
+    box.appendChild(sublabel);
+  }
+  return box;
+}
+var ACTION_STYLE = {
+  flex: "none",
+  padding: "2px 8px",
+  border: "1px solid rgba(0,0,0,0.18)",
+  borderRadius: "4px",
+  background: "#fff",
+  color: "#1a1a1a",
+  font: "inherit",
+  fontSize: "11px",
+  lineHeight: 1.4,
+  cursor: "pointer",
+  textDecoration: "none"
+};
+function buildActionBar(doc, el, typeLabel, context) {
+  const data = el.oleEmbeddedData ?? "";
+  const downloadName = el.oleEmbeddedFileName ?? el.fileName ?? typeLabel;
+  const bar = createEl(doc, "div", "pptxv-ole-actions", {
+    position: "absolute",
+    left: 0,
+    right: 0,
+    bottom: 0,
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "flex-end",
+    gap: "6px",
+    padding: "4px 6px",
+    boxSizing: "border-box",
+    background: "rgba(255,255,255,0.82)",
+    borderTop: "1px solid rgba(0,0,0,0.08)",
+    fontSize: "11px",
+    pointerEvents: "auto"
+  });
+  for (const type of ["pointerdown", "mousedown", "click"]) {
+    bar.addEventListener(type, (event) => event.stopPropagation());
+  }
+  const size = formatBytes(el.oleEmbeddedByteSize);
+  if (size) {
+    const meta = createEl(doc, "span", "pptxv-ole-meta", {
+      marginRight: "auto",
+      color: "rgba(0,0,0,0.55)",
+      overflow: "hidden",
+      textOverflow: "ellipsis",
+      whiteSpace: "nowrap"
+    });
+    meta.textContent = size;
+    bar.appendChild(meta);
+  }
+  const download = createEl(doc, "a", "pptxv-ole-action", ACTION_STYLE);
+  download.href = data;
+  download.download = downloadName;
+  const downloadTitle = context.t("pptx.ole.downloadName", { name: downloadName });
+  download.setAttribute("aria-label", downloadTitle);
+  download.title = downloadTitle;
+  download.textContent = context.t("pptx.ole.download");
+  bar.appendChild(download);
+  if (isBrowserOpenableMime(el.oleEmbeddedMimeType)) {
+    const open = createEl(doc, "button", "pptxv-ole-action", ACTION_STYLE);
+    open.type = "button";
+    const openTitle = context.t("pptx.ole.openName", { name: downloadName });
+    open.setAttribute("aria-label", openTitle);
+    open.title = openTitle;
+    open.textContent = context.t("pptx.ole.open");
+    open.addEventListener("click", () => openUrlInNewTab(data));
+    bar.appendChild(open);
+  }
+  return bar;
+}
+
+// src/pptx/dom/elements/placeholder.ts
+var renderPlaceholderElement = (element, zIndex, context) => {
+  const el = createEl(
+    context.document,
+    "div",
+    "pptxv-element pptxv-placeholder",
+    getContainerStyle(element, zIndex)
+  );
+  el.dataset.elementId = element.id;
+  el.dataset.elementType = element.type;
+  const label = createEl(context.document, "div", "pptxv-placeholder-label");
+  label.textContent = keyToLabel(element.type);
+  el.appendChild(label);
+  return el;
+};
+
+// src/pptx/dom/elements/zoom.ts
+var renderZoomElement = (element, zIndex, context) => {
+  if (element.type !== "zoom") {
+    return null;
+  }
+  const doc = context.document;
+  const summaryView = buildSummaryZoomView(
+    element,
+    (index) => {
+      const slide = context.slides?.[index];
+      return slide ? {
+        slideNumber: slide.slideNumber,
+        sectionName: slide.sectionName,
+        backgroundColor: slide.backgroundColor
+      } : void 0;
+    },
+    // The tile captions and the container aria-label are built in shared; the
+    // translator is what keeps them from rendering English inside an otherwise
+    // translated viewer.
+    (key, params) => context.t(key, params)
+  );
+  if (summaryView) {
+    const root = createEl(
+      doc,
+      "div",
+      "pptxv-element pptxv-zoom pptxv-summary-zoom",
+      getContainerStyle(element, zIndex)
+    );
+    const content = createEl(doc, "div", "pptxv-summary-zoom-content", summaryView.containerStyle);
+    root.dataset.elementId = element.id;
+    root.dataset.zoomType = "summary";
+    root.setAttribute("role", "group");
+    root.setAttribute("aria-label", summaryView.ariaLabel);
+    for (const tile2 of summaryView.tiles) {
+      const tileElement = createEl(doc, "div", "pptxv-summary-zoom-tile", {
+        ...tile2.style,
+        backgroundColor: tile2.backgroundColor,
+        overflow: "hidden",
+        border: "1px solid rgba(0, 0, 0, 0.12)"
+      });
+      tileElement.dataset.zoomTarget = String(tile2.targetSlideIndex);
+      tileElement.dataset.sectionId = tile2.sectionId;
+      tileElement.setAttribute("aria-label", tile2.ariaLabel);
+      if (context.presenting && context.onZoomClick) {
+        tileElement.setAttribute("role", "button");
+        tileElement.tabIndex = 0;
+        const activate = () => context.onZoomClick?.(
+          {
+            targetSlideIndex: tile2.targetSlideIndex,
+            targetSectionId: tile2.sectionId,
+            returnToParent: tile2.returnToParent,
+            transitionDurationMs: tile2.transitionDurationMs
+          },
+          context.currentSlideIndex ?? 0
+        );
+        tileElement.addEventListener("click", (event) => {
+          event.stopPropagation();
+          activate();
+        });
+        tileElement.addEventListener("keydown", (event) => {
+          if (event.key === "Enter" || event.key === " ") {
+            event.preventDefault();
+            event.stopPropagation();
+            activate();
+          }
+        });
+      }
+      if (tile2.imageSrc) {
+        const image = createEl(doc, "img");
+        image.src = tile2.imageSrc;
+        image.alt = tile2.ariaLabel;
+        image.style.cssText = "width:100%;height:100%;object-fit:contain";
+        tileElement.appendChild(image);
+      } else {
+        const label = createEl(doc, "div");
+        label.textContent = tile2.label;
+        const slideLabel = createEl(doc, "div");
+        slideLabel.textContent = tile2.slideLabel;
+        tileElement.append(label, slideLabel);
+      }
+      content.appendChild(tileElement);
+    }
+    const badge2 = createEl(doc, "div", "pptxv-zoom-badge");
+    badge2.textContent = context.t("pptx.zoom.summaryZoom");
+    content.appendChild(badge2);
+    root.appendChild(content);
+    return root;
+  }
+  const zoomType = element.zoomType ?? "slide";
+  const target = element.targetSlideIndex ?? 0;
+  const targetSlide = context.slides?.[target];
+  const interactive = context.presenting && context.onZoomClick !== void 0;
+  const el = createEl(doc, "div", "pptxv-element pptxv-zoom", getContainerStyle(element, zIndex));
+  el.dataset.elementId = element.id;
+  el.dataset.zoomType = zoomType;
+  el.dataset.zoomTarget = String(target);
+  if (interactive) {
+    el.classList.add("pptxv-zoom-interactive");
+    el.setAttribute("role", "button");
+    el.tabIndex = 0;
+    el.style.cursor = "pointer";
+    const activate = () => {
+      const zoomTarget = resolveZoomNavigationTarget(element);
+      if (zoomTarget) {
+        context.onZoomClick?.(zoomTarget, context.currentSlideIndex ?? 0);
+      }
+    };
+    el.addEventListener("click", (event) => {
+      event.stopPropagation();
+      activate();
+    });
+    el.addEventListener("keydown", (event) => {
+      if (event.key !== "Enter" && event.key !== " ") {
+        return;
+      }
+      event.preventDefault();
+      event.stopPropagation();
+      activate();
+    });
+  }
+  el.setAttribute(
+    "aria-label",
+    zoomType === "section" && element.targetSectionId ? context.t("pptx.zoom.ariaLabelSection", {
+      number: target + 1,
+      section: element.targetSectionId
+    }) : context.t("pptx.zoom.ariaLabel", { number: target + 1 })
+  );
+  const tile = createEl(doc, "div", "pptxv-zoom-tile", {
+    position: "relative",
+    width: "100%",
+    height: "100%",
+    overflow: "hidden",
+    borderRadius: "4px",
+    boxShadow: "0 2px 8px rgba(0, 0, 0, 0.15)"
+  });
+  if (element.imageData) {
+    const img = createEl(doc, "img", "pptxv-zoom-img", {
+      width: "100%",
+      height: "100%",
+      objectFit: "contain",
+      pointerEvents: "none",
+      userSelect: "none",
+      display: "block"
+    });
+    img.src = element.imageData;
+    img.alt = context.t("pptx.zoom.slidePreviewAlt", { number: target + 1 });
+    img.draggable = false;
+    tile.appendChild(img);
+  } else {
+    tile.appendChild(
+      buildThumbnail(
+        doc,
+        targetSlide?.slideNumber ?? target + 1,
+        targetSlide?.sectionName ?? targetSlide?.sectionId ?? element.targetSectionId,
+        targetSlide?.backgroundColor,
+        context.t
+      )
+    );
+  }
+  const badge = createEl(doc, "div", "pptxv-zoom-badge", {
+    position: "absolute",
+    bottom: "4px",
+    right: "4px",
+    fontSize: "9px",
+    padding: "1px 4px",
+    borderRadius: "2px",
+    backgroundColor: "rgba(0, 0, 0, 0.5)",
+    color: "#fff",
+    pointerEvents: "none",
+    lineHeight: 1.4
+  });
+  badge.textContent = zoomType === "section" ? context.t("pptx.zoom.sectionZoom") : context.t("pptx.zoom.slideZoom");
+  tile.appendChild(badge);
+  el.appendChild(tile);
+  return el;
+};
+function buildThumbnail(doc, slideNumber, sectionText, backgroundColor, t) {
+  const box = createEl(doc, "div", "pptxv-zoom-thumbnail", {
+    width: "100%",
+    height: "100%",
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    justifyContent: "center",
+    backgroundColor: backgroundColor ?? "#f0f0f0",
+    border: "1px solid rgba(0, 0, 0, 0.1)",
+    boxSizing: "border-box"
+  });
+  const slideLabel = createEl(doc, "div", "pptxv-zoom-slide-label", {
+    fontSize: "14px",
+    fontWeight: 600,
+    color: "rgba(0, 0, 0, 0.5)",
+    marginBottom: "4px"
+  });
+  slideLabel.textContent = t("pptx.notes.slideN", { n: slideNumber });
+  box.appendChild(slideLabel);
+  if (sectionText) {
+    const sectionLabel = createEl(doc, "div", "pptxv-zoom-section-label", {
+      fontSize: "10px",
+      color: "rgba(0, 0, 0, 0.4)"
+    });
+    sectionLabel.textContent = sectionText;
+    box.appendChild(sectionLabel);
+  }
+  return box;
+}
+
+// src/pptx/dom/elements/register-extras.ts
+function registerExtraRenderers(registry) {
+  registry.register("model3d", renderModel3dElement);
+  registry.register("zoom", renderZoomElement);
+  registry.register("contentPart", renderContentPartElement);
+}
+
+// src/pptx/dom/elements/smartart-3d.ts
+var renderSmartArt3DElement = (element, zIndex, context) => {
+  const wrapper = renderSmartArtSvg(element, zIndex, context);
+  const spec = wrapper ? resolveSmartArtThreeViewSpec(element, context.smartArt3D) : null;
+  if (!wrapper || !spec) {
+    return wrapper;
+  }
+  mountThreeViewInto(context.document, wrapper, {
+    spec,
+    interactive: Boolean(context.interactive) && !context.presenting,
+    textStyle: context.presentationStates?.get(element.id)?.textStyle
+  });
+  if (context.onSmartArtNodeTextChange && context.interactive && !context.presenting) {
+    const layer = renderSmartArtSvg(elementInLocalFrame(element), 0, context);
+    if (layer) {
+      layer.classList.add("pptxv-smartart-3d-edit-layer");
+      layer.setAttribute("data-smartart-3d-edit-layer", "true");
+      stripEditLayerMarkers(layer);
+      layer.setAttribute("aria-hidden", "true");
+      Object.assign(layer.style, { position: "absolute", inset: "0", zIndex: "1" });
+      for (const svg of layer.querySelectorAll("svg")) {
+        svg.style.opacity = "0";
+      }
+      wrapper.appendChild(layer);
+      routeEditLayerPointerToNodes(layer);
+    }
+  }
+  return wrapper;
+};
+
+// src/pptx/dom/elements/smartart-editable.ts
+var NODE_SELECTOR = "[data-smartart-node-id]";
+function nodeTarget(target) {
+  return target instanceof Element ? target.closest(NODE_SELECTOR) : null;
+}
+function enableSmartArtEditing(chrome, element, context) {
+  const data = element.smartArtData;
+  if (!data || !context.onSmartArtNodeTextChange && !context.onSmartArtNodeFillChange || !canDrillDown(element)) {
+    return;
+  }
+  let editor = null;
+  let swatches = null;
+  let hideTimer;
+  const cancelHide = () => clearTimeout(hideTimer);
+  const closeEditor = (input = editor) => {
+    if (!input || input !== editor) {
+      return;
+    }
+    editor = null;
+    input.remove();
+  };
+  chrome.addEventListener("dblclick", (event) => {
+    const target = nodeTarget(event.target);
+    const nodeId = target?.dataset.smartartNodeId;
+    if (!target || !nodeId || !context.onSmartArtNodeTextChange) {
+      return;
+    }
+    event.stopPropagation();
+    const textNode = target.querySelector("text");
+    const textRect = textNode ? measureSvgViewportRect(textNode) : null;
+    const rect = textRect && textRect.width > 0 ? textRect : measureSvgViewportRect(target);
+    if (!rect) {
+      return;
+    }
+    closeEditor();
+    swatches?.remove();
+    const input = createEl(chrome.ownerDocument, "textarea", "pptxv-smartart-node-editor", {
+      position: "absolute",
+      left: `${rect.left - 4}px`,
+      top: `${rect.top - 4}px`,
+      width: `${Math.max(48, rect.width + 8)}px`,
+      height: `${Math.max(30, rect.height + 8)}px`,
+      zIndex: "12",
+      boxSizing: "border-box",
+      padding: "4px",
+      resize: "none",
+      border: "2px solid #60a5fa",
+      borderRadius: "4px",
+      outline: "none",
+      background: "rgba(255,255,255,0.96)",
+      color: "#111827",
+      textAlign: "center"
+    });
+    editor = input;
+    input.value = findSmartArtNodeText(data, nodeId) ?? "";
+    const commit = () => {
+      if (input !== editor) {
+        return;
+      }
+      const value = input.value;
+      closeEditor(input);
+      context.onSmartArtNodeTextChange?.(element, nodeId, value);
+    };
+    input.addEventListener("blur", commit, { once: true });
+    input.addEventListener("keydown", (keyEvent) => {
+      if (keyEvent.key === "Escape") {
+        keyEvent.preventDefault();
+        closeEditor(input);
+      } else if (keyEvent.key === "Enter" && !keyEvent.shiftKey) {
+        keyEvent.preventDefault();
+        commit();
+      }
+    });
+    input.addEventListener("pointerdown", (pointerEvent) => pointerEvent.stopPropagation());
+    chrome.appendChild(input);
+    input.focus();
+    input.select();
+  });
+  chrome.addEventListener("mouseover", (event) => {
+    const target = nodeTarget(event.target);
+    const nodeId = target?.dataset.smartartNodeId;
+    if (!target || !nodeId || !context.onSmartArtNodeFillChange || editor) {
+      return;
+    }
+    cancelHide();
+    swatches?.remove();
+    const rect = measureSvgViewportRect(target);
+    if (!rect) {
+      return;
+    }
+    swatches = createEl(chrome.ownerDocument, "div", "pptxv-smartart-node-swatches", {
+      position: "absolute",
+      left: `${Math.max(0, rect.left)}px`,
+      top: `${Math.max(0, rect.top - 26)}px`,
+      zIndex: "11",
+      display: "flex",
+      gap: "4px",
+      padding: "4px",
+      border: "1px solid rgba(148,163,184,0.7)",
+      borderRadius: "6px",
+      background: "rgba(15,23,42,0.96)",
+      boxShadow: "0 4px 12px rgba(0,0,0,0.35)"
+    });
+    swatches.setAttribute("role", "group");
+    swatches.setAttribute("aria-label", context.t("pptx.smartArt.fillColor"));
+    for (const color of resolvePalette(data).slice(0, 6)) {
+      const button = createEl(chrome.ownerDocument, "button", "", {
+        width: "18px",
+        height: "18px",
+        padding: "0",
+        border: "1px solid rgba(255,255,255,0.8)",
+        borderRadius: "4px",
+        background: color,
+        cursor: "pointer"
+      });
+      button.type = "button";
+      button.setAttribute("data-pptx-compact", "");
+      button.setAttribute("aria-label", `${context.t("pptx.smartArt.fillColor")} ${color}`);
+      button.addEventListener("click", (clickEvent) => {
+        clickEvent.stopPropagation();
+        context.onSmartArtNodeFillChange?.(element, nodeId, color);
+        swatches?.remove();
+        swatches = null;
+      });
+      swatches.appendChild(button);
+    }
+    swatches.addEventListener("mouseenter", cancelHide);
+    swatches.addEventListener("mouseleave", () => {
+      swatches?.remove();
+      swatches = null;
+    });
+    chrome.appendChild(swatches);
+  });
+  chrome.addEventListener("mouseout", (event) => {
+    const target = nodeTarget(event.target);
+    const to = event.relatedTarget;
+    if (!target || !swatches || to instanceof Node && (target.contains(to) || swatches.contains(to))) {
+      return;
+    }
+    cancelHide();
+    hideTimer = setTimeout(() => {
+      swatches?.remove();
+      swatches = null;
+    }, 150);
+  });
+}
+
+// src/pptx/dom/elements/smartart-svg.ts
+function appendSvgTextLines(doc, parent, options) {
+  const textEl = createSvgEl(doc, "text", {
+    x: options.x,
+    "text-anchor": options.textAnchor ?? "middle",
+    "dominant-baseline": options.dominantBaseline ?? "central",
+    fill: options.fill,
+    "font-size": options.fontSize,
+    "font-family": options.fontFamily,
+    "font-weight": options.fontWeight,
+    "font-style": options.fontStyle
+  });
+  for (const line of options.lines) {
+    const tspan = createSvgEl(doc, "tspan", { x: options.x, y: line.y });
+    tspan.textContent = line.text;
+    textEl.appendChild(tspan);
+  }
+  parent.appendChild(textEl);
+}
+function buildSvgGradientDefs(doc, gradient) {
+  const defs = createSvgEl(doc, "defs");
+  const server = gradient.kind === "radial" ? createSvgEl(doc, "radialGradient", {
+    id: gradient.id,
+    cx: gradient.cx,
+    cy: gradient.cy,
+    r: gradient.r
+  }) : createSvgEl(doc, "linearGradient", {
+    id: gradient.id,
+    x1: gradient.x1,
+    y1: gradient.y1,
+    x2: gradient.x2,
+    y2: gradient.y2
+  });
+  for (const stop of gradient.stops) {
+    server.appendChild(
+      createSvgEl(doc, "stop", {
+        offset: stop.offset,
+        "stop-color": stop.color,
+        "stop-opacity": stop.opacity
+      })
+    );
+  }
+  defs.appendChild(server);
+  return defs;
+}
+var SMARTART_SVG_STYLE = "width:100%;height:100%;pointer-events:none;display:block";
+
+// src/pptx/dom/elements/smartart-fallback.ts
+function buildSmartArtFallbackSvg(doc, layout, a11yNodes = [], nodeIds = []) {
+  const svg = createSvgEl(doc, "svg", {
+    viewBox: layout.viewBox,
+    preserveAspectRatio: "xMidYMid meet",
+    "data-layout-family": layout.family
+  });
+  svg.setAttribute("class", "pptxv-smartart-svg");
+  svg.setAttribute("style", SMARTART_SVG_STYLE);
+  for (const conn of layout.connectors) {
+    const paint = smartArtConnectorPaint(conn);
+    svg.appendChild(
+      createSvgEl(doc, "path", {
+        d: paint.d,
+        fill: "none",
+        stroke: paint.stroke,
+        "stroke-width": paint.strokeWidth,
+        opacity: paint.opacity,
+        "stroke-dasharray": paint.dash
+      })
+    );
+  }
+  const labelsById = new Map(a11yNodes.map((node) => [node.id, node.label]));
+  for (const [index, node] of layout.nodes.entries()) {
+    const nodeId = nodeIds[index];
+    const label = nodeId ? labelsById.get(nodeId) : a11yNodes[index]?.label;
+    svg.appendChild(buildFallbackNode(doc, node, layout.shadowFilter, label, nodeId));
+  }
+  return svg;
+}
+function buildFallbackNode(doc, node, shadowFilter, a11yLabel, nodeId) {
+  const g = createSvgEl(doc, "g");
+  if (nodeId) {
+    g.dataset.smartartNodeId = nodeId;
+    g.style.pointerEvents = "auto";
+    g.style.cursor = "text";
+  }
+  if (a11yLabel) {
+    g.setAttribute("role", "img");
+    g.setAttribute("aria-label", a11yLabel);
+    const title = createSvgEl(doc, "title");
+    title.textContent = a11yLabel;
+    g.appendChild(title);
+  }
+  if (shadowFilter) {
+    g.style.filter = shadowFilter;
+  }
+  const paint = {
+    fill: node.fill,
+    stroke: node.stroke,
+    "stroke-width": node.strokeWidth,
+    opacity: node.opacity
+  };
+  if (node.kind === "circle") {
+    g.appendChild(createSvgEl(doc, "circle", { cx: node.cx, cy: node.cy, r: node.r, ...paint }));
+  } else if (node.kind === "polygon") {
+    g.appendChild(createSvgEl(doc, "polygon", { points: node.points, ...paint }));
+  } else {
+    g.appendChild(
+      createSvgEl(doc, "rect", {
+        x: node.x,
+        y: node.y,
+        width: node.width,
+        height: node.height,
+        rx: node.rx,
+        ...paint
+      })
+    );
+  }
+  const label = smartArtNodeLabel(node);
+  if (label.visible) {
+    appendSvgTextLines(doc, g, {
+      lines: label.lines,
+      x: label.x,
+      fill: label.fill,
+      fontSize: label.fontSize,
+      textAnchor: label.textAnchor,
+      dominantBaseline: label.dominantBaseline,
+      fontWeight: label.fontWeight,
+      fontStyle: label.fontStyle
+    });
+  }
+  return g;
+}
+
+// src/pptx/dom/elements/smartart.ts
+var renderSmartArtElement = (element, zIndex, context) => {
+  if (element.type !== "smartArt") {
+    return null;
+  }
+  if (context.smartArt3D) {
+    return renderSmartArt3DElement(element, zIndex, context);
+  }
+  return renderSmartArtSvg(element, zIndex, context);
+};
+var renderSmartArtSvg = (element, zIndex, context) => {
+  if (element.type !== "smartArt") {
+    return null;
+  }
+  const doc = context.document;
+  const data = element.smartArtData;
+  const wrapper = createEl(
+    doc,
+    "div",
+    "pptxv-element pptxv-smartart",
+    getContainerStyle(element, zIndex)
+  );
+  wrapper.dataset.elementId = element.id;
+  wrapper.dataset.testid = `smartart-${data?.layout ?? "diagram"}`;
+  const chrome = createEl(doc, "div", "pptxv-smartart-chrome", buildChromeStyle(data?.chrome));
+  chrome.style.position = "relative";
+  wrapper.appendChild(chrome);
+  if (data) {
+    const a11y = buildSmartArtA11y(data);
+    chrome.setAttribute("role", "img");
+    chrome.setAttribute("aria-label", a11y.label);
+  }
+  const nodes = data?.nodes ?? [];
+  const drawingShapes = data?.drawingShapes ?? [];
+  const animationState = context.presentationStates?.get(element.id);
+  const { nodes: revealedNodesFull } = resolveRevealedSmartArtNodes(
+    nodes,
+    animationState,
+    data?.presLayoutVars
+  );
+  if (data && drawingShapes.length > 0) {
+    const revealedShapes = resolveRevealedDrawingShapes(drawingShapes, nodes, animationState);
+    chrome.appendChild(
+      buildDrawingShapesSvg(doc, element.id, data, buildSmartArtA11y(data).nodes, revealedShapes)
+    );
+    enableSmartArtEditing(chrome, element, context);
+    return wrapper;
+  }
+  if (data && nodes.length > 0) {
+    const revealedNodes = revealedNodesFull;
+    const layout = computeSmartArtElementLayout(
+      data,
+      revealedNodes,
+      { width: element.width, height: element.height },
+      resolvePalette(data),
+      data.style ?? "flat",
+      element.id
+    );
+    chrome.appendChild(
+      buildSmartArtFallbackSvg(
+        doc,
+        layout,
+        buildSmartArtA11y(data).nodes,
+        flattenNodes(revealedNodes).map((node) => node.id)
+      )
+    );
+    enableSmartArtEditing(chrome, element, context);
+    return wrapper;
+  }
+  const placeholder = createEl(doc, "div", "pptxv-smartart-placeholder", {
+    width: "100%",
+    height: "100%",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    fontSize: "11px",
+    color: "rgba(255,255,255,0.8)",
+    pointerEvents: "none"
+  });
+  placeholder.textContent = context.t("pptx.smartArt.placeholder");
+  chrome.appendChild(placeholder);
+  return wrapper;
+};
+function buildDrawingShapesSvg(doc, elementId, data, a11yNodes, revealedShapes) {
+  const allShapes = data.drawingShapes ?? [];
+  const style = data.style ?? "flat";
+  const viewBox = computeDrawingViewBox(allShapes);
+  const rendered = projectDrawingShapes(
+    elementId,
+    revealedShapes,
+    viewBox,
+    resolvePalette(data),
+    style
+  );
+  const shadow = styleShadowFilter(style);
+  const labelsById = new Map(a11yNodes.map((node) => [node.id, node.label]));
+  const nodeIds = resolveRevealedDrawingShapeNodeIds(allShapes, revealedShapes, data.nodes);
+  const svg = createSvgEl(doc, "svg", {
+    viewBox: `0 0 ${viewBox.width} ${viewBox.height}`,
+    preserveAspectRatio: "xMidYMid meet"
+  });
+  svg.setAttribute("class", "pptxv-smartart-svg");
+  svg.setAttribute("style", SMARTART_SVG_STYLE);
+  for (const [index, shape] of rendered.entries()) {
+    const g = createSvgEl(doc, "g");
+    const nodeId = nodeIds[index];
+    if (nodeId) {
+      g.dataset.smartartNodeId = nodeId;
+      g.style.pointerEvents = "auto";
+      g.style.cursor = "text";
+    }
+    const label = nodeId ? labelsById.get(nodeId) : void 0;
+    if (label) {
+      g.setAttribute("role", "img");
+      g.setAttribute("aria-label", label);
+      const title = createSvgEl(doc, "title");
+      title.textContent = label;
+      g.appendChild(title);
+    }
+    if (shadow) {
+      g.style.filter = shadow;
+    }
+    if (shape.gradient) {
+      g.appendChild(buildSvgGradientDefs(doc, shape.gradient));
+    }
+    if (shape.kind === "image") {
+      const image = createSvgEl(doc, "image", {
+        x: shape.x,
+        y: shape.y,
+        width: shape.width,
+        height: shape.height,
+        preserveAspectRatio: "xMidYMid meet",
+        transform: shape.transform
+      });
+      image.setAttribute("href", shape.imageUrl ?? "");
+      g.appendChild(image);
+    } else if (shape.kind === "ellipse") {
+      g.appendChild(
+        createSvgEl(doc, "ellipse", {
+          cx: shape.cx,
+          cy: shape.cy,
+          rx: shape.width / 2,
+          ry: shape.height / 2,
+          fill: shape.fill,
+          "fill-opacity": shape.fillOpacity,
+          stroke: shape.stroke,
+          "stroke-width": shape.strokeWidth,
+          transform: shape.transform
+        })
+      );
+    } else if (shape.kind === "path") {
+      g.appendChild(
+        createSvgEl(doc, "path", {
+          d: shape.pathData,
+          fill: shape.fill,
+          "fill-opacity": shape.fillOpacity,
+          stroke: shape.stroke,
+          "stroke-width": shape.strokeWidth,
+          transform: shape.pathTransform
+        })
+      );
+    } else {
+      g.appendChild(
+        createSvgEl(doc, "rect", {
+          x: shape.x,
+          y: shape.y,
+          width: shape.width,
+          height: shape.height,
+          rx: shape.rx,
+          fill: shape.fill,
+          "fill-opacity": shape.fillOpacity,
+          stroke: shape.stroke,
+          "stroke-width": shape.strokeWidth,
+          transform: shape.transform
+        })
+      );
+    }
+    if (shape.textLines.length > 0) {
+      appendSvgTextLines(doc, g, {
+        lines: shape.textLines,
+        x: shape.textX,
+        fill: shape.fontColor,
+        fontSize: shape.fontSize,
+        fontFamily: shape.fontFamily,
+        fontWeight: shape.fontWeight,
+        fontStyle: shape.fontStyle
+      });
+    }
+    svg.appendChild(g);
+  }
+  return svg;
+}
+
+// src/pptx/dom/elements/register-rich-media.ts
+function registerRichMediaRenderers(registry) {
+  registry.register("smartArt", renderSmartArtElement);
+  registry.register("media", renderMediaElement);
+  registry.register("ink", renderInkElement);
+  registry.register("ole", renderOleElement);
+}
+
+// src/pptx/dom/elements/table-editable.ts
+var HANDLE_ZONE = 3;
+function measureRowBoundaries(table) {
+  const trs = [...table.querySelectorAll("tbody > tr")];
+  const bounds = [];
+  let cumulative = 0;
+  trs.forEach((tr, i) => {
+    cumulative += tr.offsetHeight;
+    if (i < trs.length - 1) {
+      bounds.push(cumulative);
+    }
+  });
+  return bounds;
+}
+function enableTableResize(container, table, element, context) {
+  const tableData = element.tableData;
+  if (!tableData || !context.onTableResizeColumns && !context.onTableResizeRow) {
+    return;
+  }
+  const doc = container.ownerDocument;
+  const win = doc.defaultView;
+  if (!win) {
+    return;
+  }
+  let colHandles = [];
+  let rowHandles = [];
+  function drawHandles() {
+    for (const handle of [...colHandles, ...rowHandles]) {
+      handle.remove();
+    }
+    colHandles = computeColumnBoundaries(tableData.columnWidths).map((leftPct) => {
+      const handle = createEl(doc, "div", "pptxv-table-resize-col", {
+        position: "absolute",
+        top: "0",
+        bottom: "0",
+        left: `calc(${leftPct}% - 3px)`,
+        width: "6px",
+        zIndex: "10",
+        cursor: "col-resize",
+        pointerEvents: "none"
+      });
+      container.appendChild(handle);
+      return handle;
+    });
+    rowHandles = measureRowBoundaries(table).map((topPx) => {
+      const handle = createEl(doc, "div", "pptxv-table-resize-row", {
+        position: "absolute",
+        left: "0",
+        right: "0",
+        top: `${topPx - 3}px`,
+        height: "6px",
+        zIndex: "10",
+        cursor: "row-resize",
+        pointerEvents: "none"
+      });
+      container.appendChild(handle);
+      return handle;
+    });
+  }
+  drawHandles();
+  win.requestAnimationFrame(drawHandles);
+  let drag = null;
+  function onMouseMove(event) {
+    if (!drag) {
+      return;
+    }
+    event.preventDefault();
+    const delta = drag.type === "col" ? event.clientX - drag.startPos : event.clientY - drag.startPos;
+    drag.handleEl.style.transform = drag.type === "col" ? `translateX(${delta}px)` : `translateY(${delta}px)`;
+  }
+  function onMouseUp(event) {
+    const active = drag;
+    drag = null;
+    doc.body.style.cursor = "";
+    doc.body.style.userSelect = "";
+    win?.removeEventListener("mousemove", onMouseMove);
+    win?.removeEventListener("mouseup", onMouseUp);
+    if (!active) {
+      return;
+    }
+    active.handleEl.style.transform = "";
+    if (event.clientX !== active.startPos && active.type === "col" && active.initialWidths) {
+      const rect = container.getBoundingClientRect();
+      const deltaProp = (event.clientX - active.startPos) / (rect.width || 1);
+      context.onTableResizeColumns?.(
+        element,
+        computeResizedColumnWidths(active.initialWidths, active.index, deltaProp)
+      );
+    } else if (event.clientY !== active.startPos && active.type === "row") {
+      const deltaY = event.clientY - active.startPos;
+      context.onTableResizeRow?.(
+        element,
+        active.index,
+        computeResizedRowHeight(active.initialRowHeight ?? DEFAULT_ROW_HEIGHT, deltaY)
+      );
+    }
+    drawHandles();
+  }
+  container.addEventListener("mousedown", (event) => {
+    const rect = container.getBoundingClientRect();
+    const localX = event.clientX - rect.left;
+    const localY = event.clientY - rect.top;
+    const scaleY = getTableResizeScale(rect.height, container.offsetHeight);
+    const colBoundaries = computeColumnBoundaries(tableData.columnWidths);
+    for (let i = 0; i < colBoundaries.length; i++) {
+      const boundaryX = colBoundaries[i] / 100 * rect.width;
+      if (Math.abs(localX - boundaryX) <= HANDLE_ZONE) {
+        event.preventDefault();
+        event.stopPropagation();
+        doc.body.style.cursor = "col-resize";
+        doc.body.style.userSelect = "none";
+        drag = {
+          type: "col",
+          index: i,
+          startPos: event.clientX,
+          handleEl: colHandles[i] ?? container,
+          initialWidths: [...tableData.columnWidths]
+        };
+        win.addEventListener("mousemove", onMouseMove);
+        win.addEventListener("mouseup", onMouseUp);
+        return;
+      }
+    }
+    const rowBounds = measureRowBoundaries(table);
+    for (let i = 0; i < rowBounds.length; i++) {
+      if (Math.abs(localY - rowBounds[i] * scaleY) <= HANDLE_ZONE) {
+        event.preventDefault();
+        event.stopPropagation();
+        const tr = table.querySelectorAll("tbody > tr")[i];
+        doc.body.style.cursor = "row-resize";
+        doc.body.style.userSelect = "none";
+        drag = {
+          type: "row",
+          index: i,
+          startPos: event.clientY,
+          handleEl: rowHandles[i] ?? container,
+          initialRowHeight: tr?.offsetHeight ?? DEFAULT_ROW_HEIGHT
+        };
+        win.addEventListener("mousemove", onMouseMove);
+        win.addEventListener("mouseup", onMouseUp);
+        return;
+      }
+    }
+  });
+}
+
+// src/pptx/dom/elements/table.ts
+var renderTableElement = (element, zIndex, context) => {
+  if (element.type !== "table") {
+    return null;
+  }
+  const tableData = element.tableData;
+  if (!tableData || tableData.rows.length === 0) {
+    return null;
+  }
+  const doc = context.document;
+  const container = createEl(doc, "div", "pptxv-element pptxv-table", {
+    ...getContainerStyle(element, zIndex),
+    overflow: "hidden"
+  });
+  container.dataset.elementId = element.id;
+  const table = createEl(doc, "table", "pptxv-table-grid", {
+    width: "100%",
+    height: "100%",
+    borderCollapse: "collapse",
+    tableLayout: "fixed",
+    // Load-bearing: an unstyled cell otherwise inherits the HOST chrome's
+    // font stack; all five bindings declare the same shared default here.
+    fontFamily: DEFAULT_FONT_FAMILY,
+    // `a:tblPr@rtl`: mirrors the column order for right-to-left decks.
+    ...tableContainerCss(tableData)
+  });
+  appendColgroup(doc, table, tableData.columnWidths);
+  const tbody = doc.createElement("tbody");
+  const rowCount = tableData.rows.length;
+  const columnCount = tableData.columnWidths.length;
+  tableData.rows.forEach((row, rowIndex) => {
+    const tr = doc.createElement("tr");
+    if (row.height && row.height > 0) {
+      tr.style.height = `${row.height}px`;
+    }
+    row.cells.forEach((cell, cellIndex) => {
+      if (cell.hMerge || cell.vMerge) {
+        return;
+      }
+      tr.appendChild(
+        renderCell(doc, tableData, cell, rowIndex, cellIndex, rowCount, columnCount, {
+          colorScheme: context.colorScheme,
+          tableStyleMap: context.tableStyleMap,
+          fontScheme: context.fontScheme
+        })
+      );
+    });
+    tbody.appendChild(tr);
+  });
+  table.appendChild(tbody);
+  container.appendChild(table);
+  enableTableResize(container, table, element, context);
+  return container;
+};
+var CELL_BASE_STYLE = {
+  position: "relative",
+  padding: "1px 4px",
+  verticalAlign: "top",
+  whiteSpace: "pre-wrap",
+  wordBreak: "break-word",
+  overflowWrap: "break-word"
+};
+function appendColgroup(doc, table, widths) {
+  if (widths.length === 0) {
+    return;
+  }
+  const colgroup = doc.createElement("colgroup");
+  for (const width of widths) {
+    const col = doc.createElement("col");
+    col.style.width = `${(width * 100).toFixed(2)}%`;
+    colgroup.appendChild(col);
+  }
+  table.appendChild(colgroup);
+}
+function renderCell(doc, tableData, cell, rowIndex, cellIndex, rowCount, columnCount, styleContext) {
+  const td = doc.createElement("td");
+  td.className = "pptxv-table-cell";
+  td.dataset.rowIndex = String(rowIndex);
+  td.dataset.cellIndex = String(cellIndex);
+  if (cell.gridSpan && cell.gridSpan > 1) {
+    td.colSpan = cell.gridSpan;
+  }
+  if (cell.rowSpan && cell.rowSpan > 1) {
+    td.rowSpan = cell.rowSpan;
+  }
+  const style = tableCellCss(
+    tableData,
+    cell,
+    { rowIndex, cellIndex, rowCount, columnCount },
+    styleContext
+  );
+  const patternFill = cell.style ? cellPatternFillCss(cell.style) : null;
+  if (patternFill) {
+    delete style["backgroundColor"];
+    delete style["background"];
+    if (patternFill.backgroundImage) {
+      style["backgroundImage"] = patternFill.backgroundImage;
+    }
+    if (patternFill.backgroundColor) {
+      style["backgroundColor"] = patternFill.backgroundColor;
+    }
+  }
+  applyStyleMap(td, CELL_BASE_STYLE);
+  applyStyleMap(td, style);
+  const diagonals = getCellDiagonalBorders(
+    cell.style,
+    tableData,
+    { rowIndex, cellIndex, rowCount, columnCount },
+    styleContext
+  );
+  if (diagonals) {
+    td.appendChild(renderDiagonalOverlay(doc, diagonals));
+  }
+  appendCellText(doc, td, cell);
+  return td;
+}
+function renderDiagonalOverlay(doc, diagonals) {
+  const svg = createSvgEl(doc, "svg", {
+    class: "pptxv-table-diag",
+    "aria-hidden": "true",
+    preserveAspectRatio: "none"
+  });
+  applyStyleMap(svg, {
+    position: "absolute",
+    inset: 0,
+    width: "100%",
+    height: "100%",
+    pointerEvents: "none",
+    overflow: "visible"
+  });
+  if (diagonals.diagDownColor && diagonals.diagDownWidth) {
+    svg.appendChild(
+      createSvgEl(doc, "line", {
+        x1: 0,
+        y1: 0,
+        x2: "100%",
+        y2: "100%",
+        stroke: diagonals.diagDownColor,
+        "stroke-width": diagonals.diagDownWidth
+      })
+    );
+  }
+  if (diagonals.diagUpColor && diagonals.diagUpWidth) {
+    svg.appendChild(
+      createSvgEl(doc, "line", {
+        x1: 0,
+        y1: "100%",
+        x2: "100%",
+        y2: 0,
+        stroke: diagonals.diagUpColor,
+        "stroke-width": diagonals.diagUpWidth
+      })
+    );
+  }
+  return svg;
+}
+function appendCellText(doc, td, cell) {
+  const richCell = cell;
+  const textRuns = richCell.textRuns && richCell.textRuns.length > 0 ? richCell.textRuns : null;
+  if (!textRuns) {
+    const span = createEl(doc, "span", "pptxv-table-text", { position: "relative" });
+    span.textContent = cell.text || " ";
+    td.appendChild(span);
+    return;
+  }
+  for (const run of textRuns) {
+    if (run.isParagraphBreak) {
+      td.appendChild(
+        createEl(doc, "div", "pptxv-table-para-break", { display: "block", height: 0 })
+      );
+      continue;
+    }
+    if (run.isLineBreak) {
+      td.appendChild(doc.createElement("br"));
+      continue;
+    }
+    const span = createEl(doc, "span", "pptxv-table-run", {
+      position: "relative",
+      ...cellRunStyle(run)
+    });
+    span.textContent = run.text;
+    td.appendChild(span);
+  }
+}
+
+// src/pptx/dom/elements/register-table-chart.ts
+function registerTableChartRenderers(registry) {
+  registry.register("table", renderTableElement);
+  registry.register("chart", renderChartElement);
+}
+
+// src/pptx/dom/glyph-outline-cache.ts
+var glyphOutlineFontCache = new GlyphOutlineFontCache();
+var getGlyphOutline = createGlyphOutlineLookup(glyphOutlineFontCache);
+
+// src/pptx/dom/elements/text-warp.ts
+function renderWarpedText(element, context) {
+  if (!hasTextProperties(element)) {
+    return null;
+  }
+  const style = element.textStyle;
+  const preset = style?.textWarpPreset;
+  if (!preset || preset === "textNoShape" || preset === "textPlain") {
+    return null;
+  }
+  const paragraphs = groupIntoParagraphs(element);
+  if (paragraphs.length === 0) {
+    return null;
+  }
+  if (!shouldUseSvgWarp(preset)) {
+    const transform = getWarpCssTransform(preset, style?.textWarpAdj, style?.textWarpAdj2);
+    if (!transform) {
+      return null;
+    }
+    const text = createEl(context.document, "div", "pptxv-wordart", {
+      width: "100%",
+      height: "100%",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      transform: transform.transform,
+      transformOrigin: transform.transformOrigin
+    });
+    if (style?.color) {
+      text.style.color = style.color;
+    }
+    if (style?.fontFamily) {
+      text.style.fontFamily = style.fontFamily;
+    }
+    if (style?.fontSize) {
+      text.style.fontSize = `${style.fontSize}px`;
+    }
+    if (style?.bold) {
+      text.style.fontWeight = "bold";
+    }
+    text.textContent = paragraphs.map((p) => p.segments.map((s) => s.text).join("")).join("\n");
+    return text;
+  }
+  if (hasGlyphEnvelope(preset)) {
+    return renderGlyphWarp(element, paragraphs, context);
+  }
+  return renderPathWarp(element, paragraphs, context);
+}
+function segmentFont(segment, elementStyle) {
+  const s = segment.style ?? {};
+  const family = s.fontFamily || elementStyle.fontFamily;
+  return {
+    fontFamily: family ? getSubstituteFontFamily(family) : DEFAULT_FONT_FAMILY,
+    fontSizePx: s.fontSize ?? elementStyle.fontSize ?? 18,
+    bold: s.bold ?? elementStyle.bold,
+    italic: s.italic ?? elementStyle.italic
+  };
+}
+function renderGlyphWarp(element, paragraphs, context) {
+  const style = element.textStyle;
+  const preset = style.textWarpPreset;
+  const width = Math.max(element.width, 1);
+  const height = Math.max(element.height, 1);
+  const svg = createSvgEl(context.document, "svg", {
+    viewBox: `0 0 ${width} ${height}`,
+    "aria-hidden": "true"
+  });
+  svg.setAttribute("class", "pptxv-wordart");
+  svg.setAttribute("style", "position:absolute;inset:0;width:100%;height:100%;overflow:visible");
+  const perLine = buildGlyphEnvelopeBlock(
+    preset,
+    paragraphs.map(
+      (paragraph) => paragraph.segments.map((seg, i) => ({
+        text: seg.text,
+        font: segmentFont(seg, style),
+        segmentIndex: i
+      }))
+    ),
+    width,
+    height,
+    style.align,
+    style.textWarpAdj,
+    style.textWarpAdj2,
+    getGlyphOutline
+  );
+  paragraphs.forEach((paragraph, lineIndex) => {
+    const segments = paragraph.segments;
+    const glyphs = perLine[lineIndex] ?? [];
+    glyphs.forEach((g, glyphIndex) => {
+      const s = segments[g.segmentIndex]?.style ?? {};
+      const fill = s.color ?? style.color ?? "#000000";
+      const renderedFamily = s.fontFamily || style.fontFamily;
+      const textAttrs = {
+        fill,
+        "font-family": renderedFamily ? getSubstituteFontFamily(renderedFamily) : DEFAULT_FONT_FAMILY,
+        "font-size": s.fontSize ?? style.fontSize ?? 18,
+        "font-weight": s.bold ?? style.bold ? "bold" : void 0,
+        "font-style": s.italic ?? style.italic ? "italic" : void 0
+      };
+      if (g.outlinePath) {
+        const path = createSvgEl(context.document, "path", { d: g.outlinePath, fill });
+        svg.appendChild(path);
+        return;
+      }
+      if (!g.slices || g.slices.length <= 1) {
+        const text = createSvgEl(context.document, "text", {
+          x: g.x,
+          y: g.y,
+          transform: g.transform,
+          ...textAttrs
+        });
+        text.textContent = g.char;
+        svg.appendChild(text);
+        return;
+      }
+      const group = createSvgEl(context.document, "g", {
+        "data-glyph-slices": g.slices.length
+      });
+      g.slices.forEach((slice, sliceIndex) => {
+        const clipId = `${element.id.replace(/[^a-zA-Z0-9_-]/gu, "_")}-warp-l${lineIndex}-g${glyphIndex}-s${sliceIndex}`;
+        const clipPath = createSvgEl(context.document, "clipPath", {
+          id: clipId,
+          clipPathUnits: "userSpaceOnUse"
+        });
+        clipPath.appendChild(
+          createSvgEl(context.document, "rect", {
+            x: slice.clipX0,
+            y: -1e5,
+            width: slice.clipX1 - slice.clipX0,
+            height: 2e5
+          })
+        );
+        group.appendChild(clipPath);
+        const text = createSvgEl(context.document, "text", {
+          x: g.x,
+          y: g.y,
+          transform: slice.transform,
+          "clip-path": `url(#${clipId})`,
+          ...textAttrs
+        });
+        text.textContent = g.char;
+        group.appendChild(text);
+      });
+      svg.appendChild(group);
+    });
+  });
+  return svg;
+}
+function renderPathWarp(element, paragraphs, context) {
+  const style = element.textStyle;
+  const preset = style.textWarpPreset;
+  const svg = createSvgEl(context.document, "svg", {
+    viewBox: `0 0 ${Math.max(element.width, 1)} ${Math.max(element.height, 1)}`,
+    preserveAspectRatio: "none",
+    "aria-hidden": "true"
+  });
+  svg.setAttribute("class", "pptxv-wordart");
+  svg.setAttribute("style", "position:absolute;inset:0;width:100%;height:100%;overflow:visible");
+  const defs = createSvgEl(context.document, "defs");
+  paragraphs.forEach((paragraph, index) => {
+    const id = `${element.id.replace(/[^a-zA-Z0-9_-]/gu, "_")}-warp-${index}`;
+    defs.appendChild(
+      createSvgEl(context.document, "path", {
+        id,
+        d: buildWarpPath(
+          preset,
+          element.width,
+          element.height,
+          index,
+          paragraphs.length,
+          style.textWarpAdj,
+          style.textWarpAdj2
+        )
+      })
+    );
+    const text = createSvgEl(context.document, "text", {
+      fill: style.color ?? "#000000",
+      "font-family": style.fontFamily ? getSubstituteFontFamily(style.fontFamily) : DEFAULT_FONT_FAMILY,
+      "font-size": style.fontSize ?? 18,
+      "font-weight": style.bold ? "bold" : void 0,
+      "font-style": style.italic ? "italic" : void 0
+    });
+    const textPath = createSvgEl(context.document, "textPath", {
+      href: `#${id}`,
+      startOffset: "50%",
+      "text-anchor": "middle"
+    });
+    textPath.textContent = paragraph.segments.map((segment) => segment.text).join("");
+    text.appendChild(textPath);
+    svg.appendChild(text);
+  });
+  svg.insertBefore(defs, svg.firstChild);
+  return svg;
+}
+
+// src/pptx/dom/elements/text-shape.ts
+var renderTextShapeElement = (element, zIndex, context) => {
+  const container = getContainerStyle(element, zIndex);
+  const animState = context.presentationStates?.get(element.id);
+  const shape = getShapeFillStrokeStyle(
+    element,
+    animState?.animatesFill,
+    animState?.animatesStroke
+  );
+  const merged = { ...container, ...shape };
+  const transform = composeTransforms(container["transform"], shape["transform"]);
+  if (transform !== void 0) {
+    merged["transform"] = transform;
+  }
+  const el = createEl(context.document, "div", "pptxv-element pptxv-shape", merged);
+  el.dataset.elementId = element.id;
+  if (context.interactive && !context.presenting) {
+    const hitTargetStyle = elementHitTargetStyle(element);
+    if (hitTargetStyle) {
+      const hitTarget = createEl(context.document, "div", void 0, hitTargetStyle);
+      hitTarget.setAttribute("aria-hidden", "true");
+      hitTarget.setAttribute("data-pptx-hit-target", "true");
+      el.appendChild(hitTarget);
+    }
+  }
+  const subpathFill = renderShapeSubpathFillOverlay(context.document, element);
+  if (subpathFill) {
+    el.appendChild(subpathFill);
+  }
+  const extrusion = renderExtrusionOverlay(context.document, element);
+  if (extrusion) {
+    el.appendChild(extrusion);
+  }
+  const filterDefs = renderShapeFilterDefs(context.document, element);
+  if (filterDefs) {
+    el.appendChild(filterDefs);
+  }
+  const fillOverlay = renderShapeFillOverlay(context.document, element);
+  if (fillOverlay) {
+    el.appendChild(fillOverlay);
+  }
+  const gradientOutline = renderStrokeOutline(context.document, element);
+  if (gradientOutline) {
+    el.appendChild(gradientOutline);
+  }
+  const hollowHit = renderHollowHitOutline(context.document, element);
+  if (hollowHit) {
+    el.appendChild(hollowHit);
+  }
+  const reflection = renderReflectionOverlay(context.document, element, context.mediaDataUrls);
+  if (reflection) {
+    el.appendChild(reflection);
+  }
+  const equation = renderEquations(element, context);
+  const warped = equation ? null : renderWarpedText(element, context);
+  if (equation) {
+    el.appendChild(equation);
+  } else if (warped) {
+    el.appendChild(warped);
+  } else {
+    const linkedSegments = getOverflowSegments(element, context.slide?.elements);
+    const paragraphs = buildParagraphs(element, context.fieldContext, linkedSegments);
+    const hasText = paragraphs.some((p) => p.runs.length > 0 || p.bulletMarker !== void 0);
+    if (hasText) {
+      el.appendChild(
+        renderTextBlock(context.document, paragraphs, getTextBlockStyle(element), {
+          elementId: element.id,
+          states: context.presentationStates
+        })
+      );
+    } else {
+      const mode = context.interactive && !context.presenting ? "edit" : "present";
+      const prompt = placeholderPromptDescriptor(element, mode);
+      if (prompt) {
+        const hint = createEl(context.document, "div", "pptxv-placeholder-prompt", {
+          ...getTextBlockStyle(element),
+          ...prompt.style
+        });
+        hint.textContent = prompt.text;
+        el.appendChild(hint);
+      }
+    }
+  }
+  return el;
+};
+
+// src/pptx/dom/elements/index.ts
+function createDefaultRegistry() {
+  const registry = createElementRendererRegistry();
+  registry.register("text", renderTextShapeElement);
+  registry.register("shape", renderTextShapeElement);
+  registry.register("image", renderImageElement);
+  registry.register("picture", renderImageElement);
+  registry.register("group", renderGroupElement);
+  registry.register("connector", renderConnectorElement);
+  registerTableChartRenderers(registry);
+  registerRichMediaRenderers(registry);
+  registerExtraRenderers(registry);
+  registry.setFallback(renderPlaceholderElement);
+  return registry;
+}
+async function loadPresentation(buffer, options) {
+  const handler = new PptxHandler();
+  const blobUrls = [];
+  try {
+    const parsed = await handler.load(buffer, {
+      allowExternalImages: options?.allowExternalImages,
+      maxUncompressedBytes: options?.maxUncompressedBytes
+    });
+    const getImageData = (path) => handler.getImageData(path);
+    const mediaDataUrls = await resolveMediaUrls(handler, parsed.slides, blobUrls);
+    const imageResolvedSlides = await resolveImageUrls(handler, parsed.slides);
+    const tableCellResolvedSlides = await resolveTableCellImageUrls(
+      imageResolvedSlides,
+      getImageData
+    );
+    const tableStyleMap = await resolveTableStyleImageUrls(parsed.tableStyleMap, getImageData);
+    const slides = await resolveTextFillBlipUrls(tableCellResolvedSlides, getImageData);
+    return {
+      handler,
+      slides,
+      sections: parsed.sections ?? [],
+      presentationProperties: parsed.presentationProperties ?? {},
+      viewProperties: parsed.viewProperties,
+      headerFooter: parsed.headerFooter ?? {},
+      coreProperties: parsed.coreProperties,
+      appProperties: parsed.appProperties,
+      customProperties: parsed.customProperties ?? [],
+      customShows: parsed.customShows ?? [],
+      modernCommentAuthors: parsed.modernCommentAuthors ?? [],
+      commentAuthors: parsed.commentAuthors ?? [],
+      embeddedFonts: parsed.embeddedFonts ?? [],
+      hasDigitalSignatures: parsed.hasDigitalSignatures ?? false,
+      digitalSignatureCount: parsed.digitalSignatureCount ?? 0,
+      isPasswordProtected: parsed.isPasswordProtected ?? false,
+      canvasSize: {
+        width: parsed.width ?? DEFAULT_CANVAS_WIDTH,
+        height: parsed.height ?? DEFAULT_CANVAS_HEIGHT
+      },
+      mediaDataUrls,
+      colorScheme: parsed.theme?.colorScheme,
+      fontScheme: parsed.theme?.fontScheme,
+      themeName: parsed.theme?.name,
+      tagCollections: parsed.tags ?? [],
+      tableStyleMap,
+      tableStylesDefaultId: parsed.tableStylesDefaultId,
+      slideMasters: parsed.slideMasters ?? [],
+      themeOptions: parsed.themeOptions ?? [],
+      notesMaster: parsed.notesMaster,
+      handoutMaster: parsed.handoutMaster,
+      hasMacros: parsed.hasMacros ?? false,
+      modifyVerifier: parsed.modifyVerifier,
+      warnings: parsed.warnings ?? [],
+      slideSize: typeof parsed.widthEmu === "number" && typeof parsed.heightEmu === "number" && parsed.widthEmu > 0 && parsed.heightEmu > 0 ? {
+        widthEmu: parsed.widthEmu,
+        heightEmu: parsed.heightEmu,
+        type: parsed.slideSizeType ?? ""
+      } : void 0,
+      notesCanvasSize: typeof parsed.notesWidthEmu === "number" && typeof parsed.notesHeightEmu === "number" && parsed.notesWidthEmu > 0 && parsed.notesHeightEmu > 0 ? {
+        width: Math.round(parsed.notesWidthEmu / 9525),
+        height: Math.round(parsed.notesHeightEmu / 9525)
+      } : void 0,
+      blobUrls
+    };
+  } catch (error) {
+    revokeBlobUrls(blobUrls);
+    handler.dispose();
+    throw error;
+  }
+}
+function revokeBlobUrls(urls) {
+  for (const url of urls) {
+    if (url.startsWith("blob:")) {
+      URL.revokeObjectURL(url);
+    }
+  }
+}
+async function resolveMediaUrls(handler, slides, blobUrls) {
+  const mediaElements = [];
+  for (const slide of slides) {
+    collectMediaElements(slide.elements, mediaElements);
+  }
+  const urls = /* @__PURE__ */ new Map();
+  await Promise.all(
+    mediaElements.map(async (mediaElement) => {
+      const resolved = await resolveMediaElementSource(mediaElement, handler);
+      if (resolved.missing || !resolved.mediaPath || !resolved.url) {
+        mediaElement.mediaMissing = true;
+        return;
+      }
+      urls.set(resolved.mediaPath, resolved.url);
+      if (resolved.isBlobUrl) {
+        blobUrls.push(resolved.url);
+      }
+    })
+  );
+  const soundPaths = collectAnimationSoundPaths(slides).filter((path) => !urls.has(path));
+  await Promise.all(
+    soundPaths.map(async (soundPath) => {
+      try {
+        const arrayBuffer = await handler.getMediaArrayBuffer(soundPath);
+        if (arrayBuffer) {
+          const blobUrl = URL.createObjectURL(new Blob([arrayBuffer]));
+          blobUrls.push(blobUrl);
+          urls.set(soundPath, blobUrl);
+        }
+      } catch {
+      }
+    })
+  );
+  return urls;
+}
+async function resolveImageUrls(handler, slides) {
+  const { paths, refs } = collectImagePaths(slides);
+  if (paths.size === 0) {
+    return slides;
+  }
+  const resolvedMap = /* @__PURE__ */ new Map();
+  await Promise.all(
+    Array.from(paths).map(async (path) => {
+      try {
+        const url = await handler.getImageData(path);
+        if (url) {
+          resolvedMap.set(path, url);
+        }
+      } catch {
+      }
+    })
+  );
+  return slides.map((slide) => {
+    const newElements = applyImagePathPatches(slide.elements, resolvedMap, refs);
+    return newElements === slide.elements ? slide : { ...slide, elements: newElements };
+  });
+}
+
+export { SMARTART_SVG_STYLE, appendCommentMarkers, appendRunContent, appendSvgTextLines, applyMediaPresentingState, applyStyleMap, applyThreeViewTextStyle, attachChartEditing, buildActiveXControlsOverlay, buildOleIcon, buildReflectionMirrorContent, buildSmartArtFallbackSvg, buildStrokeSvg, buildSvgGradientDefs, collectThreeViews, composeTransforms, createChartTitleEditor, createDefaultRegistry, createEl, createElementRendererRegistry, createSvgEl, enableSmartArtEditing, enableTableResize, getGlyphOutline, getShapeFillStrokeStyle, getTextBlockStyle, glyphOutlineFontCache, isChart3DEditable, loadPresentation, mountThreeViewInto, reRenderPresentationElements, registerExtraRenderers, registerRichMediaRenderers, registerTableChartRenderers, renderChartElement, renderChartSvgElement, renderConnectorElement, renderContentPartElement, renderEquations, renderExtrusionOverlay, renderGroupElement, renderHollowHitOutline, renderImageElement, renderInkElement, renderMediaElement, renderModel3dElement, renderOleElement, renderPlaceholderElement, renderReflectionOverlay, renderShapeFillOverlay, renderShapeFilterDefs, renderShapeSubpathFillOverlay, renderSlideStage, renderSmartArt3DElement, renderSmartArtElement, renderSmartArtSvg, renderStrokeOutline, renderTableElement, renderTextBlock, renderTextShapeElement, renderWarpedText, renderZoomElement, rendering3DFlagsOf, resolveChartPalette, resolveMediaUrls, revokeBlobUrls, selectedChartPartOf, setSvgAttrs, takeReusableThreeView, wireChartThreeViewEvents, wireMediaFullscreenOverlay, withReusableThreeViews };