pptx-react-viewer 2.22.0 → 3.0.1

package/dist/{chunk-7BZYDUNM.mjs → chunk-S6PFSR7I.mjs}

@@ -1,5 +1,5 @@
 import { translationsEn } from './chunk-L5MNLIQF.mjs';
-import { SHAPE_PRESET_DEFS, VIEWER_SHORTCUT_REFERENCE, getAnimationInitialStyle, cloneHistorySnapshot, hasShapeProperties, getImageFitStyle, isImageLikeElement, getImageTilingStyle, runMediaCommand, findMediaElementByElementId, mediaPlaybackAttributes, buildTextBlockStyle, hasTextProperties, toCssWritingMode, toCssTextOrientation, toCssVerticalDirection, buildTextBodyLayoutStyle, buildTextBody3DSceneStyle, buildParagraphs, colorWithOpacity, normalizeHexColor, build3DExtrusionData, getComputedFillStyle, getComputedEffectStyle, getComputedStrokeStyle, isStrokeOnlyPresetElement, resolveShapeGeometry, normalizeStrokeDashType, getSvgStrokeDasharray, buildSvgGradientDef, isCalloutShape, getCalloutLeaderLineGeometry, buildCalloutLeaderLineSvgPath, getCalloutViewBoxBounds, svgLineCap, getCompoundLineOffsets, getCompoundLineWidths, computeSelectionRect, DEFAULT_FONT_FAMILY, cellStyleToCss, rectToCells, isCellInRect, tableContainerCss, buildChartViewModel, resolveChartKind, chartPreserveAspectRatio, buildNotesPdfBytes, buildSlidesPdfBytes, buildPreviewAnimation, buildMotionPathPreview, getRoundRectRadiusPx2, getResolvedShapeClipPath, mediaFallbackVisual, registerPersistentAudio, resolveAutoFitFontScale, getSubstituteFontFamily, parsePanoseString, hasDistinctScriptFonts, nestedTextDecorationStyle, pieceLetterSpacing, resolveMetricTrackingPx, hollowTextFillStyle, TEXT_BUILD_ID_SEP, buildTextBuildSpec, textBuildSpanStyle, apply3dEffects, clampUnitInterval, customGeometryPathsToSvgSubpaths, svgGradientFillRef, computeColumnBoundaries, getTableCellBandStyle, parseDrawingColor, parseDrawingColorOpacity, getCellDiagonalBorders, cellRunStyle, getChartStylePalette, computeChartLegendLayout, mediaFallbackIcon, mediaFallbackLabelKey, MEDIA_CHROME_ATTRIBUTE, convertOmmlToMathMl, sanitizeMathMl, tableCellCss, computeResizedColumnWidths, computeResizedRowHeight, DEFAULT_ROW_HEIGHT, ooxmlGradientAngleToCssDegrees, chartPartToAttrs, splitRunForMetrics, hexToRgbChannels, segmentByScript, resolveFontForScript } from './chunk-57TM4MV4.mjs';
+import { SHAPE_PRESET_DEFS, VIEWER_SHORTCUT_REFERENCE, getAnimationInitialStyle, cloneHistorySnapshot, hasShapeProperties, getImageFitStyle, isImageLikeElement, getImageTilingStyle, runMediaCommand, findMediaElementByElementId, mediaPlaybackAttributes, buildTextBlockStyle, hasTextProperties, toCssWritingMode, toCssTextOrientation, toCssVerticalDirection, buildTextBodyLayoutStyle, buildTextBody3DSceneStyle, buildParagraphs, colorWithOpacity, normalizeHexColor, build3DExtrusionData, getComputedFillStyle, getComputedEffectStyle, getComputedStrokeStyle, isStrokeOnlyPresetElement, resolveShapeGeometry, normalizeStrokeDashType, getSvgStrokeDasharray, buildSvgGradientDef, isCalloutShape, getCalloutLeaderLineGeometry, buildCalloutLeaderLineSvgPath, getCalloutViewBoxBounds, svgLineCap, getCompoundLineOffsets, getCompoundLineWidths, computeSelectionRect, DEFAULT_FONT_FAMILY, cellStyleToCss, rectToCells, isCellInRect, tableContainerCss, buildChartViewModel, resolveChartKind, chartPreserveAspectRatio, buildNotesPdfBytes, buildSlidesPdfBytes, buildPreviewAnimation, buildMotionPathPreview, getRoundRectRadiusPx2, getResolvedShapeClipPath, mediaFallbackVisual, registerPersistentAudio, resolveAutoFitFontScale, resolveFontKerning, getSubstituteFontFamily, parsePanoseString, resolveScriptFontSet, hasDistinctScriptFonts, nestedTextDecorationStyle, pieceLetterSpacing, resolveMetricTrackingPx, hollowTextFillStyle, buildTabContext, TEXT_BUILD_ID_SEP, buildTextBuildSpec, textBuildSpanStyle, apply3dEffects, clampUnitInterval, customGeometryPathsToSvgSubpaths, svgGradientFillRef, buildSubpathPaints, computeColumnBoundaries, getTableCellBandStyle, parseDrawingColor, parseDrawingColorOpacity, getCellDiagonalBorders, cellRunStyle, getChartStylePalette, computeChartLegendLayout, mediaFallbackIcon, mediaFallbackLabelKey, MEDIA_CHROME_ATTRIBUTE, convertOmmlToMathMl, sanitizeMathMl, tableCellCss, computeResizedColumnWidths, computeResizedRowHeight, DEFAULT_ROW_HEIGHT, ooxmlGradientAngleToCssDegrees, buildRunTabLines, chartPartToAttrs, splitRunForMetrics, splitRunByScriptFont } from './chunk-OXPD2UYI.mjs';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import React6, { useRef, useState, useEffect, useCallback, useMemo, useLayoutEffect } from 'react';
@@ -1215,136 +1215,13 @@ function wrapWithTextBuildAnimation(elementId, paraIndex, renderedSegments, para
     );
   });
 }
-var EPS = 0.01;
-var FALLBACK_STEP_PX = 48;
-function buildTabContext(tabStops, defaultTabSize, fontSizePx, fontFamily, bold, italic) {
-  if (!tabStops || tabStops.length === 0) {
-    return void 0;
-  }
-  const font = `${italic ? "italic " : ""}${bold ? "700" : "400"} ${fontSizePx}px ${fontFamily}`;
-  return {
-    tabStops,
-    defaultTabSize: typeof defaultTabSize === "number" && defaultTabSize > 0 ? defaultTabSize : 0,
-    font
-  };
-}
-function leaderGlyph(leader) {
-  switch (leader) {
-    case "dot":
-      return ".";
-    case "hyphen":
-      return "-";
-    case "underscore":
-      return "_";
-    default:
-      return "";
-  }
-}
-function decimalIndex(text) {
-  return text.indexOf(".");
-}
-function computeTabbedLayout(segments, tabStops, measure, defaultTabSize) {
-  const stops = tabStops.filter((s) => Number.isFinite(s.position) && s.position > 0).sort((a, b) => a.position - b.position);
-  const step = Number.isFinite(defaultTabSize) && defaultTabSize > 0 ? defaultTabSize : FALLBACK_STEP_PX;
-  const pieces = [];
-  let cursor = 0;
-  segments.forEach((text, i) => {
-    if (i === 0) {
-      pieces.push({ text, left: 0, leaderWidth: 0, leaderChar: "" });
-      cursor = measure(text);
-      return;
-    }
-    const stop = stops.find((s) => s.position > cursor + EPS);
-    const width = measure(text);
-    let tabX;
-    let align;
-    let leader;
-    if (stop) {
-      tabX = stop.position;
-      align = stop.align;
-      leader = stop.leader;
-    } else {
-      tabX = Math.floor(cursor / step + 1 + EPS) * step;
-      align = "l";
-      leader = void 0;
-    }
-    let left;
-    if (align === "ctr") {
-      left = tabX - width / 2;
-    } else if (align === "r") {
-      left = tabX - width;
-    } else if (align === "dec") {
-      const decIdx = decimalIndex(text);
-      const beforeWidth = decIdx >= 0 ? measure(text.slice(0, decIdx)) : width;
-      left = tabX - beforeWidth;
-    } else {
-      left = tabX;
-    }
-    if (left < cursor) {
-      left = cursor;
-    }
-    const leaderWidth = left - cursor;
-    const leaderChar = leaderWidth > 0.5 ? leaderGlyph(leader) : "";
-    pieces.push({ text, left, leaderWidth, leaderChar });
-    cursor = left + width;
-  });
-  return pieces;
-}
-var cachedCtx;
-function getMeasureCtx() {
-  if (cachedCtx !== void 0) {
-    return cachedCtx;
-  }
-  if (typeof document === "undefined") {
-    cachedCtx = null;
-    return null;
-  }
-  cachedCtx = document.createElement("canvas").getContext("2d");
-  return cachedCtx;
-}
-function estimateWidth(text) {
-  return text.length * 8;
-}
-function measureTextWidth(text, font) {
-  const ctx = getMeasureCtx();
-  if (!ctx) {
-    return estimateWidth(text);
-  }
-  ctx.font = font;
-  return ctx.measureText(text).width;
-}
-function fillLeader(glyph, width, font) {
-  const glyphWidth = Math.max(1, measureTextWidth(glyph, font));
-  const count = Math.ceil(width / glyphWidth) + 1;
-  return glyph.repeat(count);
-}
 function renderTabbedLine(line, ctx, keyPrefix, renderPiece, nestedStyle) {
-  const segments = line.split("	");
-  const pieces = computeTabbedLayout(
-    segments,
-    ctx.tabStops,
-    (t) => measureTextWidth(t, ctx.font),
-    ctx.defaultTabSize
-  );
-  return /* @__PURE__ */ jsx("span", { style: { display: "inline-block", whiteSpace: "nowrap" }, children: pieces.map((piece, i) => {
+  const [lineLayout] = buildRunTabLines(line, ctx, nestedStyle);
+  return /* @__PURE__ */ jsx("span", { style: { display: "inline-block", whiteSpace: "nowrap" }, children: lineLayout.pieces.map((piece, i) => {
     const key = `${keyPrefix}-tab-${i}`;
     return /* @__PURE__ */ jsxs(React6.Fragment, { children: [
-      piece.leaderWidth > 0 ? /* @__PURE__ */ jsx(
-        "span",
-        {
-          "aria-hidden": "true",
-          style: {
-            display: "inline-block",
-            width: piece.leaderWidth,
-            overflow: "hidden",
-            whiteSpace: "nowrap",
-            textAlign: "right",
-            verticalAlign: "baseline"
-          },
-          children: piece.leaderChar ? fillLeader(piece.leaderChar, piece.leaderWidth, ctx.font) : ""
-        }
-      ) : null,
-      /* @__PURE__ */ jsx("span", { style: { ...nestedStyle, display: "inline-block", whiteSpace: "pre" }, children: renderPiece(piece.text, key) })
+      piece.leaderStyle ? /* @__PURE__ */ jsx("span", { "aria-hidden": "true", style: piece.leaderStyle, children: piece.leaderText }) : null,
+      /* @__PURE__ */ jsx("span", { style: piece.style, children: renderPiece(piece.text, key) })
     ] }, key);
   }) });
 }
@@ -1352,23 +1229,18 @@ function renderScriptAwareText(text, needsScriptFonts, scriptFonts, baseFontFami
   if (!needsScriptFonts || !text) {
     return text;
   }
-  const runs = segmentByScript(text);
-  if (runs.length <= 1) {
-    if (runs.length === 1) {
-      const font = resolveFontForScript(runs[0].script, scriptFonts);
-      if (font && font !== baseFontFamily) {
-        return /* @__PURE__ */ jsx("span", { style: { ...nestedStyle, fontFamily: font }, children: text });
-      }
-    }
+  const pieces = splitRunByScriptFont(
+    text,
+    scriptFonts,
+    baseFontFamily,
+    nestedStyle
+  );
+  if (!pieces) {
     return text;
   }
-  return runs.map((run, i) => {
-    const font = resolveFontForScript(run.script, scriptFonts);
-    if (!font || font === baseFontFamily) {
-      return /* @__PURE__ */ jsx(React6.Fragment, { children: run.text }, `${keyPrefix}-r${i}`);
-    }
-    return /* @__PURE__ */ jsx("span", { style: { ...nestedStyle, fontFamily: font }, children: run.text }, `${keyPrefix}-r${i}`);
-  });
+  return pieces.map(
+    (piece, i) => piece.style ? /* @__PURE__ */ jsx("span", { style: piece.style, children: piece.text }, `${keyPrefix}-r${i}`) : /* @__PURE__ */ jsx(React6.Fragment, { children: piece.text }, `${keyPrefix}-r${i}`)
+  );
 }
 function renderMetricPieces(text, metric, keyPrefix, inner) {
   if (!metric || !text) {
@@ -1520,6 +1392,74 @@ function renderEquationSegment(elementId, segmentIndex, equationXml, equationNum
   }
   return /* @__PURE__ */ jsx("span", { children: equationContent }, `${elementId}-seg-${segmentIndex}`);
 }
+function renderHyperlink(run, spanNode, key, ctx) {
+  const url = run.hyperlink?.url;
+  const onHyperlinkClick = ctx.onHyperlinkClick;
+  if (!url || !onHyperlinkClick) {
+    return spanNode;
+  }
+  const requireCtrlClick = ctx.requireCtrlClick;
+  const displayUrl = url.startsWith("ppaction://") ? url.replace(/^ppaction:\/\//u, "").split("?")[0] : url;
+  const follow = (modified) => {
+    if (requireCtrlClick && !modified) {
+      return false;
+    }
+    onHyperlinkClick(url);
+    return true;
+  };
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      role: "link",
+      tabIndex: 0,
+      className: requireCtrlClick ? "group/link relative" : void 0,
+      style: { cursor: requireCtrlClick ? void 0 : "pointer", pointerEvents: "auto" },
+      title: run.hyperlink?.tooltip,
+      onClick: (e) => {
+        if (!follow(e.ctrlKey || e.metaKey)) {
+          return;
+        }
+        e.stopPropagation();
+        e.preventDefault();
+      },
+      onKeyDown: (e) => {
+        if (e.key !== "Enter" && e.key !== " ") {
+          return;
+        }
+        if (!follow(e.ctrlKey || e.metaKey)) {
+          return;
+        }
+        e.preventDefault();
+        e.stopPropagation();
+      },
+      children: [
+        spanNode,
+        requireCtrlClick && /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute left-0 top-full z-[9999] mt-1 max-w-64 opacity-0 transition-opacity duration-150 group-hover/link:opacity-100", children: /* @__PURE__ */ jsxs("span", { className: "flex flex-col rounded border border-border bg-popover px-2.5 py-1.5 shadow-lg", children: [
+          /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-foreground", children: displayUrl }),
+          /* @__PURE__ */ jsx("span", { className: "mt-0.5 text-[10px] text-muted-foreground", children: "Ctrl+Click to follow link" })
+        ] }) })
+      ]
+    },
+    `${key}-link`
+  );
+}
+function wrapWithTextReflection(run, key, spanNode, spanStyle, baseContent) {
+  if (!run.reflection) {
+    return spanNode;
+  }
+  return /* @__PURE__ */ jsxs("span", { style: { position: "relative", display: "inline-block" }, children: [
+    spanNode,
+    /* @__PURE__ */ jsx(
+      "span",
+      {
+        "aria-hidden": "true",
+        className: "pptx-react-text-reflection",
+        style: run.reflection,
+        children: /* @__PURE__ */ jsx("span", { style: spanStyle, children: baseContent })
+      }
+    )
+  ] }, `${key}-reflwrap`);
+}
 var BASELINE_FONT_SCALE = 0.65;
 function renderParagraphRun(run, segment, ctx, keySuffix = "") {
   const { element, fallbackColor, findHighlights, onHyperlinkClick } = ctx;
@@ -1541,29 +1481,13 @@ function renderParagraphRun(run, segment, ctx, keySuffix = "") {
   const rawFontSize = segmentStyle.fontSize || element.textStyle?.fontSize || DEFAULT_TEXT_FONT_SIZE;
   const baseFontSize = rawFontSize * resolveAutoFitFontScale(element.textStyle);
   const baselineShift = baselineFraction !== 0 ? `${baselineFraction * baseFontSize}px` : void 0;
-  const baseFontSizePt = baseFontSize * (72 / 96);
-  const fontKerning = typeof segmentStyle.kerning === "number" ? segmentStyle.kerning === 0 ? "none" : baseFontSizePt >= segmentStyle.kerning / 100 ? "normal" : "none" : void 0;
+  const fontKerning = resolveFontKerning(segmentStyle.kerning, baseFontSize);
   const rawFontFamily = segmentStyle.fontFamily || element.textStyle?.fontFamily;
   const baseFontFamily = rawFontFamily ? getSubstituteFontFamily(
     rawFontFamily,
     parsePanoseString(segmentStyle.latinFontPanose ?? element.textStyle?.latinFontPanose)
   ) : DEFAULT_FONT_FAMILY2;
-  const scriptFont = (name, panose) => name ? getSubstituteFontFamily(name, parsePanoseString(panose)) : baseFontFamily;
-  const scriptFonts = {
-    latin: baseFontFamily,
-    eastAsia: scriptFont(
-      segmentStyle.eastAsiaFont || element.textStyle?.eastAsiaFont,
-      segmentStyle.eastAsiaFontPanose ?? element.textStyle?.eastAsiaFontPanose
-    ),
-    complexScript: scriptFont(
-      segmentStyle.complexScriptFont || element.textStyle?.complexScriptFont,
-      segmentStyle.complexScriptFontPanose ?? element.textStyle?.complexScriptFontPanose
-    ),
-    symbol: scriptFont(
-      segmentStyle.symbolFont || element.textStyle?.symbolFont,
-      segmentStyle.symbolFontPanose ?? element.textStyle?.symbolFontPanose
-    )
-  };
+  const scriptFonts = resolveScriptFontSet(segmentStyle, element.textStyle, baseFontFamily);
   const needsScriptFonts = hasDistinctScriptFonts(scriptFonts);
   const authoredLetterSpacing = typeof segmentStyle.characterSpacing === "number" && segmentStyle.characterSpacing !== 0 ? segmentStyle.characterSpacing / 100 * (96 / 72) : 0;
   const metricFont = {
@@ -1616,7 +1540,8 @@ function renderParagraphRun(run, segment, ctx, keySuffix = "") {
     metricContext
   );
   const spanNode = /* @__PURE__ */ jsx("span", { "data-seg-idx": segmentIndex, style: spanStyle, children: renderRubyOrText(run, baseContent) }, key);
-  return run.hyperlink && onHyperlinkClick ? renderHyperlink(run, spanNode, key, ctx) : spanNode;
+  const reflectedNode = wrapWithTextReflection(run, key, spanNode, spanStyle, baseContent);
+  return run.hyperlink && onHyperlinkClick ? renderHyperlink(run, reflectedNode, key, ctx) : reflectedNode;
 }
 function renderRubyOrText(run, baseContent) {
   if (!run.ruby) {
@@ -1629,57 +1554,6 @@ function renderRubyOrText(run, baseContent) {
     /* @__PURE__ */ jsx("rp", { children: ")" })
   ] });
 }
-function renderHyperlink(run, spanNode, key, ctx) {
-  const url = run.hyperlink?.url;
-  const onHyperlinkClick = ctx.onHyperlinkClick;
-  if (!url || !onHyperlinkClick) {
-    return spanNode;
-  }
-  const requireCtrlClick = ctx.requireCtrlClick;
-  const displayUrl = url.startsWith("ppaction://") ? url.replace(/^ppaction:\/\//u, "").split("?")[0] : url;
-  const follow = (modified) => {
-    if (requireCtrlClick && !modified) {
-      return false;
-    }
-    onHyperlinkClick(url);
-    return true;
-  };
-  return /* @__PURE__ */ jsxs(
-    "span",
-    {
-      role: "link",
-      tabIndex: 0,
-      className: requireCtrlClick ? "group/link relative" : void 0,
-      style: { cursor: requireCtrlClick ? void 0 : "pointer", pointerEvents: "auto" },
-      title: run.hyperlink?.tooltip,
-      onClick: (e) => {
-        if (!follow(e.ctrlKey || e.metaKey)) {
-          return;
-        }
-        e.stopPropagation();
-        e.preventDefault();
-      },
-      onKeyDown: (e) => {
-        if (e.key !== "Enter" && e.key !== " ") {
-          return;
-        }
-        if (!follow(e.ctrlKey || e.metaKey)) {
-          return;
-        }
-        e.preventDefault();
-        e.stopPropagation();
-      },
-      children: [
-        spanNode,
-        requireCtrlClick && /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute left-0 top-full z-[9999] mt-1 max-w-64 opacity-0 transition-opacity duration-150 group-hover/link:opacity-100", children: /* @__PURE__ */ jsxs("span", { className: "flex flex-col rounded border border-border bg-popover px-2.5 py-1.5 shadow-lg", children: [
-          /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-foreground", children: displayUrl }),
-          /* @__PURE__ */ jsx("span", { className: "mt-0.5 text-[10px] text-muted-foreground", children: "Ctrl+Click to follow link" })
-        ] }) })
-      ]
-    },
-    `${key}-link`
-  );
-}
 function renderTextSegments(element, fallbackColor, emptyFallback, findHighlights, onHyperlinkClick, fieldContext, subElementAnimStates, segmentOverrides, requireCtrlClick) {
   if (!hasTextProperties(element)) {
     return emptyFallback || null;
@@ -1953,7 +1827,10 @@ function getShapeVisualStyle(element, _hasFill, fillColor, _strokeWidth, _stroke
     // opposite end along the edge. Paint from the border box instead.
     backgroundOrigin: "border-box",
     boxShadow: fx.boxShadow,
-    WebkitBoxReflect: fx.webkitBoxReflect,
+    // Reflection is no longer a single CSS property (`-webkit-box-reflect`
+    // never worked in Firefox): `ElementRenderer` renders a mirrored sibling
+    // node instead, using shared's `getReflectionWrapperStyle` directly (see
+    // `ReflectionOverlay`).
     filter: fx.filter,
     opacity: fx.opacity,
     // Only proxy the DAG blend onto the whole element for the blend-only case:
@@ -2142,44 +2019,6 @@ function renderConnectorMarker(markerId, arrowType, color, arrowWidth, arrowLeng
     }
   );
 }
-
-// src/viewer/utils/vector-subpath-paint.ts
-function toHexByte(value) {
-  const clamped = Math.max(0, Math.min(255, Math.round(value)));
-  return clamped.toString(16).padStart(2, "0");
-}
-function shiftHex(hex, factor, towardsWhite) {
-  const channels = hexToRgbChannels(hex);
-  if (!channels) {
-    return hex;
-  }
-  const shift = (c) => towardsWhite ? c + (255 - c) * factor : c * (1 - factor);
-  return `#${toHexByte(shift(channels.r))}${toHexByte(shift(channels.g))}${toHexByte(shift(channels.b))}`;
-}
-function adjustFillForMode(fillHex, mode) {
-  switch (mode) {
-    case "lighten":
-      return shiftHex(fillHex, 0.4, true);
-    case "lightenLess":
-      return shiftHex(fillHex, 0.2, true);
-    case "darken":
-      return shiftHex(fillHex, 0.4, false);
-    case "darkenLess":
-      return shiftHex(fillHex, 0.2, false);
-    default:
-      return fillHex;
-  }
-}
-function buildCustomSubpathPaints(subpaths, hasFill, fillColor, fillOpacity) {
-  return subpaths.map((subpath) => {
-    const fillOff = subpath.fillMode === "none" || !hasFill;
-    return {
-      d: subpath.d,
-      fill: fillOff ? "none" : colorWithOpacity(adjustFillForMode(fillColor, subpath.fillMode), fillOpacity),
-      stroked: subpath.stroke !== false
-    };
-  });
-}
 function joinStyle(shapeStyle) {
   const lineJoin = shapeStyle?.lineJoin === "bevel" ? "bevel" : shapeStyle?.lineJoin === "miter" ? "miter" : "round";
   const miterLimit = lineJoin === "miter" && typeof shapeStyle?.miterLimit === "number" ? Math.max(shapeStyle.miterLimit / 1e5, 1) : void 0;
@@ -2248,7 +2087,7 @@ function renderCustomGeometryVector(pathData, pathWidth, pathHeight, structuredP
   const gradientPaint = gradient ? svgGradientFillRef(gradient) : void 0;
   const nodes = [];
   if (subpaths && needsPerSubpath) {
-    const paints = buildCustomSubpathPaints(subpaths, hasFill, fillColor, fillOpacity);
+    const paints = buildSubpathPaints(subpaths, hasFill, fillColor, fillOpacity);
     paints.forEach((paint, idx) => {
       if (paint.fill !== "none") {
         const mode = subpaths[idx]?.fillMode;
@@ -3773,6 +3612,8 @@ function renderText(t, key) {
       fontSize: t.fontSize,
       fill: t.fill,
       fontWeight: t.fontWeight ?? "normal",
+      fontStyle: t.fontStyle ?? "normal",
+      fontFamily: t.fontFamily,
       dominantBaseline: t.dominantBaseline,
       opacity: t.opacity ?? 1,
       transform: t.transform,
@@ -3852,7 +3693,19 @@ function renderChartViewModel(elementId, vm, preserveAspectRatio = "none") {
             transform: `translate(${item.x.toFixed(1)},${item.y.toFixed(1)})`,
             children: [
               /* @__PURE__ */ jsx("rect", { x: 0, y: -7, width: 10, height: 10, rx: 2, fill: item.color }),
-              /* @__PURE__ */ jsx("text", { x: 13, y: 3, fontSize: 9, fill: "#475569", children: item.label })
+              /* @__PURE__ */ jsx(
+                "text",
+                {
+                  x: 13,
+                  y: 3,
+                  fontSize: item.fontSize,
+                  fill: item.fill,
+                  fontWeight: item.fontWeight,
+                  fontStyle: item.fontStyle,
+                  fontFamily: item.fontFamily,
+                  children: item.label
+                }
+              )
             ]
           },
           `${elementId}-lg-${i}`
@@ -3981,4 +3834,4 @@ function stopPreviewAnimation() {
   activePreview = null;
 }
 
-export { ANIMATION_PRESET_OPTIONS, ARROW_SIZE_OPTIONS, CONNECTOR_ARROW_OPTIONS, DEFAULT_CANVAS_HEIGHT, DEFAULT_CANVAS_WIDTH, DEFAULT_FILL_COLOR, DEFAULT_FONT_FAMILY2 as DEFAULT_FONT_FAMILY, DEFAULT_SECTION_GROUP_ID, DEFAULT_STROKE_COLOR, DEFAULT_TABLE_COLUMNS, DEFAULT_TABLE_ROWS, DEFAULT_TEXT_COLOR, DEFAULT_TEXT_FONT_SIZE, EMU_PER_PX, GRID_SIZE, HYPERLINK_COLOR, MIN_ELEMENT_SIZE, SHAPE_PRESETS, SHORTCUT_REFERENCE_ITEMS, SLIDE_NAV_THUMBNAIL_WIDTH, STROKE_DASH_OPTIONS, THEME_COLOR_SWATCHES, TOOLBAR_SECTIONS, UNGROUPED_SECTION_ID, ZOOM_TO_SELECTION_PADDING, build3DExtrusionData2 as build3DExtrusionData, buildLineGlowFilter, buildLineShadowCss, buildNotesPdf, buildPdfFromImageData, buildReactChartViewModel, buildTextBody3DSceneStyle2 as buildTextBody3DSceneStyle, cloneHistorySnapshot2 as cloneHistorySnapshot, cn, executeMediaCommand, getAnimationInitialStyle2 as getAnimationInitialStyle, getConnectorPathGeometry, getCropShapeClipPath, getDuotoneColors, getImageRenderStyle, getImageTilingStyle2 as getImageTilingStyle, getShapeVisualStyle, getTextLayoutStyle, getTextStyleForElement, getTextWarpStyle, hasDagDuotoneEffect, isConnectorOrLineElement, renderChartElement, renderConnectorMarker, renderDagDuotoneSvgFilter, renderMediaElement, renderTableElement, renderTextSegments, renderVectorShape, shouldRenderFallbackLabel, startMotionPathPreview, startPreviewAnimation, stopPreviewAnimation };
+export { ANIMATION_PRESET_OPTIONS, ARROW_SIZE_OPTIONS, CONNECTOR_ARROW_OPTIONS, DEFAULT_CANVAS_HEIGHT, DEFAULT_CANVAS_WIDTH, DEFAULT_FILL_COLOR, DEFAULT_FONT_FAMILY2 as DEFAULT_FONT_FAMILY, DEFAULT_SECTION_GROUP_ID, DEFAULT_STROKE_COLOR, DEFAULT_TABLE_COLUMNS, DEFAULT_TABLE_ROWS, DEFAULT_TEXT_COLOR, DEFAULT_TEXT_FONT_SIZE, GRID_SIZE, HYPERLINK_COLOR, MIN_ELEMENT_SIZE, SHAPE_PRESETS, SHORTCUT_REFERENCE_ITEMS, SLIDE_NAV_THUMBNAIL_WIDTH, STROKE_DASH_OPTIONS, THEME_COLOR_SWATCHES, TOOLBAR_SECTIONS, UNGROUPED_SECTION_ID, ZOOM_TO_SELECTION_PADDING, build3DExtrusionData2 as build3DExtrusionData, buildLineGlowFilter, buildLineShadowCss, buildNotesPdf, buildPdfFromImageData, buildReactChartViewModel, buildTextBody3DSceneStyle2 as buildTextBody3DSceneStyle, cloneHistorySnapshot2 as cloneHistorySnapshot, cn, executeMediaCommand, getAnimationInitialStyle2 as getAnimationInitialStyle, getConnectorPathGeometry, getCropShapeClipPath, getDuotoneColors, getImageRenderStyle, getImageTilingStyle2 as getImageTilingStyle, getShapeVisualStyle, getTextLayoutStyle, getTextStyleForElement, getTextWarpStyle, hasDagDuotoneEffect, isConnectorOrLineElement, renderChartElement, renderConnectorMarker, renderDagDuotoneSvgFilter, renderMediaElement, renderTableElement, renderTextSegments, renderVectorShape, shouldRenderFallbackLabel, startMotionPathPreview, startPreviewAnimation, stopPreviewAnimation };