ooxml-ui 0.30.0 → 0.31.0

package/dist/pptx/chunk-X2F6PA2D.mjs

@@ -0,0 +1,1045 @@
+import { chartTextFontFamily, chartFontPx, computePlotLayout, radarAngle, computeStackedSeriesPlots, computeLayoutOptions, computeStackedValueRange, valueToY2, collapseChartTitleRunsForEdit, computePieLayout, buildMarkTooltip, formatAxisValueWithUnits, axisTickValues } from './chunk-7JEMQW6R.mjs';
+
+// src/pptx/render/chart-legend-layout.ts
+var LEGEND_ITEM_WIDTH = 80;
+var LEGEND_ITEM_HEIGHT = 14;
+var DEFAULT_LEGEND_FONT_SIZE = 9;
+var DEFAULT_LEGEND_TEXT_COLOR = "#475569";
+function computeChartLegendLayout(vm) {
+  const vertical = vm.legendAnchor === "start";
+  return vm.legend.map((entry, i) => {
+    const x = vertical ? vm.legendX : vm.legendX - vm.legend.length * LEGEND_ITEM_WIDTH / 2 + i * LEGEND_ITEM_WIDTH, y = vertical ? vm.legendY + i * LEGEND_ITEM_HEIGHT : vm.legendY, textStyle = entry.textStyle;
+    return {
+      x,
+      y,
+      color: entry.color,
+      label: entry.label,
+      fontSize: textStyle?.fontSize !== void 0 ? chartFontPx(textStyle.fontSize) : DEFAULT_LEGEND_FONT_SIZE,
+      fill: textStyle?.color ?? DEFAULT_LEGEND_TEXT_COLOR,
+      fontWeight: textStyle?.bold ? "bold" : "normal",
+      fontStyle: textStyle?.italic ? "italic" : "normal",
+      fontFamily: chartTextFontFamily(textStyle),
+      ...entry.lineSwatch ? { lineSwatch: entry.lineSwatch } : {}
+    };
+  });
+}
+
+// src/pptx/render/chart-interaction-radar.ts
+function buildRadarDragGeometry(element, chartData, categoryLabels, pointIndex) {
+  if (chartData.chartType !== "radar") {
+    return null;
+  }
+  const catCount = Math.max(categoryLabels.length, 1);
+  if (pointIndex < 0 || pointIndex >= catCount) {
+    return null;
+  }
+  const layout = computePlotLayout(element.width, element.height, chartData, false), cx = layout.plotLeft + layout.plotWidth / 2, cy = layout.plotTop + layout.plotHeight / 2, radius = Math.max(Math.min(layout.plotWidth, layout.plotHeight) / 2 - 4, 1), maxVal = Math.max(1, ...chartData.series.flatMap((s) => s.values.map((v) => Math.abs(v)))), angle = radarAngle(pointIndex, catCount);
+  return { cx, cy, radius, maxVal, angle };
+}
+function resolveRadarDragValue(geometry, pointerX, pointerY) {
+  const { cx, cy, radius, maxVal, angle } = geometry, dx = pointerX - cx, dy = pointerY - cy, radial = Math.max(dx * Math.cos(angle) + dy * Math.sin(angle), 0), value = radial / radius * maxVal, range = {
+    span: Math.max(maxVal, value, 1)
+  };
+  return roundDragValue(value, range);
+}
+
+// src/pptx/render/chart-interaction-stacked.ts
+function buildStackedDragGeometry(element, chartData, seriesIndex, pointIndex) {
+  const grouping = chartData.grouping;
+  if (grouping !== "stacked" && grouping !== "percentStacked") {
+    return null;
+  }
+  const seriesValues = chartData.series.map((s) => s.values), draggedValues = seriesValues[seriesIndex];
+  if (!draggedValues || pointIndex < 0 || pointIndex >= draggedValues.length) {
+    return null;
+  }
+  const percent = grouping === "percentStacked", catCount = Math.max(
+    chartData.categories.length,
+    ...seriesValues.map((values) => values.length),
+    pointIndex + 1
+  ), plots = computeStackedSeriesPlots(seriesValues, catCount, percent), baseValue = plots[seriesIndex]?.base[pointIndex] ?? 0, otherAbsSum = seriesValues.reduce(
+    (sum, values, si) => si === seriesIndex ? sum : sum + Math.abs(values[pointIndex] ?? 0),
+    0
+  ), layoutOpts = computeLayoutOptions(chartData.axes, chartData.dataTable, chartData.series.length), layout = computePlotLayout(element.width, element.height, chartData, true, layoutOpts), range = percent ? { min: 0, max: 100, span: 100 } : computeStackedValueRange(chartData.series, catCount, layout.autoPlotHeight);
+  return {
+    range,
+    plotTop: layout.plotTop,
+    plotBottom: layout.plotBottom,
+    baseValue,
+    otherAbsSum,
+    percent
+  };
+}
+function resolveStackedDragValue(geometry, pointerY) {
+  const { range, plotTop, plotBottom, baseValue, otherAbsSum, percent } = geometry, pointerScalar = valueFromY(pointerY, range, plotTop, plotBottom), delta = pointerScalar - baseValue;
+  if (!percent) {
+    return roundDragValue(delta, range);
+  }
+  const sign = delta < 0 ? -1 : 1, absValue = shareToValue(Math.abs(delta) / 100, otherAbsSum), valueRange = {
+    span: Math.max(otherAbsSum, absValue, 1)
+  };
+  return roundDragValue(sign * absValue, valueRange);
+}
+
+// src/pptx/render/chart-interaction.ts
+var CHART_PART_ATTR = "data-chart-part";
+var CHART_PART_SERIES_ATTR = "data-chart-series";
+var CHART_PART_POINT_ATTR = "data-chart-point";
+function chartPartToAttrs(part) {
+  const attrs = {
+    [CHART_PART_ATTR]: part.role,
+    [CHART_PART_SERIES_ATTR]: String(part.seriesIndex)
+  };
+  if (part.pointIndex !== void 0) {
+    attrs[CHART_PART_POINT_ATTR] = String(part.pointIndex);
+  }
+  return attrs;
+}
+function chartPartFromElement(el) {
+  if (!el) {
+    return null;
+  }
+  const role = el.getAttribute(CHART_PART_ATTR);
+  if (role !== "dataPoint" && role !== "series") {
+    return null;
+  }
+  const seriesIndex = Number.parseInt(el.getAttribute(CHART_PART_SERIES_ATTR) ?? "", 10);
+  if (!Number.isInteger(seriesIndex) || seriesIndex < 0) {
+    return null;
+  }
+  const pointRaw = el.getAttribute(CHART_PART_POINT_ATTR);
+  if (pointRaw === null) {
+    return { role, seriesIndex };
+  }
+  const pointIndex = Number.parseInt(pointRaw, 10);
+  if (!Number.isInteger(pointIndex) || pointIndex < 0) {
+    return { role, seriesIndex };
+  }
+  return { role, seriesIndex, pointIndex };
+}
+function findChartPartTarget(target) {
+  if (!target || typeof target !== "object") {
+    return null;
+  }
+  const el = target;
+  if (typeof el.closest !== "function" || typeof el.getAttribute !== "function") {
+    return null;
+  }
+  return chartPartFromElement(el.closest(`[${CHART_PART_ATTR}]`));
+}
+function isSameChartPart(a, b) {
+  if (!a || !b) {
+    return a === b;
+  }
+  return a.role === b.role && a.seriesIndex === b.seriesIndex && a.pointIndex === b.pointIndex;
+}
+function valueFromY(y, range, topY, bottomY) {
+  const usable = bottomY - topY;
+  if (usable === 0) {
+    return range.min;
+  }
+  const ratio = range.reverseOrder ? (y - topY) / usable : (bottomY - y) / usable;
+  if (range.logScale && range.logBase) {
+    const base = range.logBase;
+    const logMin = Math.log(range.min) / Math.log(base);
+    const logVal = logMin + ratio * range.span;
+    return base ** logVal;
+  }
+  return range.min + ratio * range.span;
+}
+function roundDragValue(value, range) {
+  if (!Number.isFinite(value) || range.span <= 0) {
+    return value;
+  }
+  const step = 10 ** (Math.floor(Math.log10(range.span)) - 2);
+  const rounded = Math.round(value / step) * step;
+  return Number.parseFloat(rounded.toPrecision(12));
+}
+function shareToValue(share, otherAbsSum) {
+  const clamped = Math.min(Math.max(share, 0), 0.999999);
+  if (clamped <= 0) {
+    return 0;
+  }
+  const ratio = clamped / (1 - clamped);
+  return otherAbsSum > 0 ? ratio * otherAbsSum : ratio;
+}
+function rangeForSeries(drag, seriesIndex) {
+  const useSecondary = drag.secondaryRange !== void 0 && (drag.secondarySeriesIndexes?.includes(seriesIndex) ?? false);
+  return useSecondary && drag.secondaryRange ? drag.secondaryRange : drag.range;
+}
+function dragValueForPart(viewY, drag, seriesIndex) {
+  const range = rangeForSeries(drag, seriesIndex);
+  return roundDragValue(valueFromY(viewY, range, drag.plotTop, drag.plotBottom), range);
+}
+function dragAnchorViewY(value, drag, seriesIndex) {
+  return valueToY2(value, rangeForSeries(drag, seriesIndex), drag.plotTop, drag.plotBottom);
+}
+function withChartPointValue(chartData, seriesIndex, pointIndex, value) {
+  const series = chartData.series[seriesIndex];
+  if (!series || pointIndex < 0 || pointIndex >= series.values.length) {
+    return chartData;
+  }
+  return {
+    ...chartData,
+    series: chartData.series.map(
+      (s, i) => i === seriesIndex ? { ...s, values: s.values.map((v, j) => j === pointIndex ? value : v) } : s
+    )
+  };
+}
+function withChartTitle(chartData, title) {
+  const trimmed = title.trim();
+  return {
+    ...chartData,
+    // A multi-run title collapses to one run in its dominant style so this
+    // edit does not leave another, now-stale run's text trailing the new
+    // title; see `collapseChartTitleRunsForEdit`'s doc.
+    ...collapseChartTitleRunsForEdit(chartData, trimmed),
+    style: { ...chartData.style, hasTitle: trimmed.length > 0 }
+  };
+}
+function buildChartMarkDragGeometry(params) {
+  const { kind, element, chartData, categoryLabels, seriesIndex, pointIndex } = params;
+  if (kind === "pie" || kind === "doughnut") {
+    const geometry = buildPieDragGeometry(element, chartData, pointIndex);
+    return geometry ? { kind: "pie", ...geometry } : null;
+  }
+  if (kind === "radar") {
+    const geometry = buildRadarDragGeometry(element, chartData, categoryLabels, pointIndex);
+    return geometry ? { kind: "radar", ...geometry } : null;
+  }
+  if (kind === "bar" || kind === "line" || kind === "area") {
+    const geometry = buildStackedDragGeometry(element, chartData, seriesIndex, pointIndex);
+    return geometry ? { kind: "stackedSegment", ...geometry } : null;
+  }
+  return null;
+}
+function resolveChartDragValue(geometry, pointer) {
+  switch (geometry.kind) {
+    case "pie":
+      return resolvePieDragValue(geometry, pointer.x, pointer.y);
+    case "radar":
+      return resolveRadarDragValue(geometry, pointer.x, pointer.y);
+    case "stackedSegment":
+      return resolveStackedDragValue(geometry, pointer.y);
+    default: {
+      const exhaustive = geometry;
+      return exhaustive;
+    }
+  }
+}
+
+// src/pptx/render/chart-interaction-pie.ts
+var TWO_PI = Math.PI * 2;
+var ANGLE_EPSILON = TWO_PI * 1e-3;
+function buildPieDragGeometry(element, chartData, pointIndex) {
+  if (chartData.chartType !== "pie" && chartData.chartType !== "doughnut") {
+    return null;
+  }
+  const series = chartData.series[0];
+  if (!series || pointIndex < 0 || pointIndex >= series.values.length) {
+    return null;
+  }
+  const isDoughnut = chartData.chartType === "doughnut", { cx, cy } = computePieLayout(element.width, element.height, chartData, isDoughnut), startAngle = -Math.PI / 2 + (chartData.firstSliceAngle ?? 0) * Math.PI / 180;
+  return { cx, cy, values: series.values, pointIndex, startAngle };
+}
+function resolvePieSliceShareValue(pointerAngle, leadingAngle, values, pointIndex) {
+  const total = values.reduce((sum, v) => sum + Math.abs(v), 0) || 1, rawSpan = (pointerAngle - leadingAngle) % TWO_PI + TWO_PI, span = Math.min(Math.max(rawSpan % TWO_PI, ANGLE_EPSILON), TWO_PI - ANGLE_EPSILON), share = span / TWO_PI, own = values[pointIndex] ?? 0, sign = own < 0 ? -1 : 1, others = total - Math.abs(own), absValue = shareToValue(share, others), range = {
+    span: Math.max(total, absValue, 1)
+  };
+  return roundDragValue(sign * absValue, range);
+}
+function resolvePieDragValue(geometry, pointerX, pointerY) {
+  const { cx, cy, values, pointIndex, startAngle } = geometry, total = values.reduce((sum, v) => sum + Math.abs(v), 0) || 1, before = values.slice(0, pointIndex).reduce((sum, v) => sum + Math.abs(v), 0), leadingAngle = startAngle + before / total * TWO_PI, pointerAngle = Math.atan2(pointerY - cy, pointerX - cx);
+  return resolvePieSliceShareValue(pointerAngle, leadingAngle, values, pointIndex);
+}
+
+// src/pptx/render/chart-canvas-drag.ts
+var CHART_DRAG_THRESHOLD_PX = 3;
+var STYLE_ELEMENT_ID = "pptx-chart-interaction-styles";
+var INTERACTION_CSS = `
+.pptx-chart-interactive svg [data-chart-part] { pointer-events: auto; cursor: pointer; }
+.pptx-chart-interactive svg [data-chart-part]:hover { filter: brightness(1.12); }
+.pptx-chart-interactive svg [data-chart-part='title'] { cursor: text; }
+/* A data label is decoration painted ON TOP of the mark it describes, so it
+   must never intercept that mark's click. The treemap made this unmissable -
+   its label sits dead-centre on the cell, so clicking a cell hit the <text> and
+   selected nothing - but every kind's data labels overlap their marks. Only
+   labels are excluded: the chart title is itself a part and stays clickable.
+   Bindings whose chart <svg> is blanket pointer-events:none (React) never saw
+   this; the other three did, which is exactly why the rule belongs here. */
+.pptx-chart-interactive svg text:not([data-chart-part]) { pointer-events: none; }
+.pptx-chart-interactive svg .pptx-chart-part-selected { filter: drop-shadow(0 0 2.5px #3b82f6); }
+.pptx-chart-interactive svg .pptx-chart-part-selected:hover { filter: drop-shadow(0 0 2.5px #3b82f6) brightness(1.12); }
+`;
+function ensureChartInteractionStyles() {
+  if (typeof document === "undefined" || document.getElementById(STYLE_ELEMENT_ID)) {
+    return;
+  }
+  const style = document.createElement("style");
+  style.id = STYLE_ELEMENT_ID;
+  style.textContent = INTERACTION_CSS;
+  document.head.appendChild(style);
+}
+var CHART_INTERACTIVE_CLASS = "pptx-chart-interactive";
+var CHART_PART_SELECTED_CLASS = "pptx-chart-part-selected";
+function isChartInteractionArmed(node) {
+  let current = node;
+  while (current && typeof current.closest === "function") {
+    if (current.closest(`.${CHART_INTERACTIVE_CLASS}`) !== null) {
+      return true;
+    }
+    const root = typeof current.getRootNode === "function" ? current.getRootNode() : null;
+    current = root?.host ?? null;
+  }
+  return false;
+}
+function applyChartPartHighlight(root, part) {
+  if (!root) {
+    return;
+  }
+  for (const node of root.querySelectorAll(`.${CHART_PART_SELECTED_CLASS}`)) {
+    node.classList.remove(CHART_PART_SELECTED_CLASS);
+  }
+  if (!part) {
+    return;
+  }
+  const pointSelector = part.pointIndex !== void 0 ? `[data-chart-point='${part.pointIndex}']` : ":not([data-chart-point])";
+  const selector = `[data-chart-part='${part.role}'][data-chart-series='${part.seriesIndex}']${pointSelector}`;
+  for (const node of root.querySelectorAll(selector)) {
+    node.classList.add(CHART_PART_SELECTED_CLASS);
+  }
+}
+function beginChartValueDrag(params) {
+  const { part, viewModel, chartData, clientY } = params;
+  if (part.role !== "dataPoint" || part.pointIndex === void 0 || !viewModel.valueDrag) {
+    return null;
+  }
+  const startValue = chartData.series[part.seriesIndex]?.values[part.pointIndex] ?? 0;
+  return {
+    part,
+    drag: viewModel.valueDrag,
+    svgHeight: viewModel.svgHeight,
+    startClientY: clientY,
+    anchorViewY: dragAnchorViewY(startValue, viewModel.valueDrag, part.seriesIndex),
+    baseChartData: chartData,
+    moved: false,
+    lastData: null
+  };
+}
+function advanceChartValueDrag(state, clientY, svgHeight) {
+  if (!state.moved && Math.abs(clientY - state.startClientY) < CHART_DRAG_THRESHOLD_PX) {
+    return null;
+  }
+  if (svgHeight === 0 || state.part.pointIndex === void 0) {
+    return null;
+  }
+  state.moved = true;
+  const deltaViewY = (clientY - state.startClientY) / svgHeight * state.svgHeight;
+  const value = dragValueForPart(
+    state.anchorViewY + deltaViewY,
+    state.drag,
+    state.part.seriesIndex
+  );
+  const chartData = withChartPointValue(
+    state.baseChartData,
+    state.part.seriesIndex,
+    state.part.pointIndex,
+    value
+  );
+  state.lastData = chartData;
+  return { chartData, value };
+}
+
+// src/pptx/render/chart-view-model-dom-helpers.ts
+var SVG_NS = "http://www.w3.org/2000/svg";
+function setSvgAttrs(el, attrs) {
+  for (const [name, value] of Object.entries(attrs)) {
+    if (value !== void 0) {
+      el.setAttribute(name, String(value));
+    }
+  }
+}
+function createSvgEl(doc, tag, attrs) {
+  const el = doc.createElementNS(SVG_NS, tag);
+  if (attrs) {
+    setSvgAttrs(el, attrs);
+  }
+  return el;
+}
+function renderPatternDef(doc, def) {
+  if (def.kind !== "pattern") {
+    const gradient = def.kind === "linearGradient" ? createSvgEl(doc, "linearGradient", {
+      id: def.id,
+      x1: def.x1,
+      y1: def.y1,
+      x2: def.x2,
+      y2: def.y2
+    }) : createSvgEl(doc, "radialGradient", { id: def.id, cx: def.cx, cy: def.cy, r: def.r });
+    for (const stop of def.stops) {
+      gradient.appendChild(
+        createSvgEl(doc, "stop", {
+          offset: stop.offset,
+          "stop-color": stop.color,
+          "stop-opacity": stop.opacity
+        })
+      );
+    }
+    return gradient;
+  }
+  const pattern = createSvgEl(doc, "pattern", {
+    id: def.id,
+    patternUnits: def.patternUnits,
+    x: def.x,
+    y: def.y,
+    width: def.width,
+    height: def.height
+  });
+  pattern.appendChild(
+    createSvgEl(doc, "image", {
+      href: def.href,
+      x: 0,
+      y: 0,
+      width: def.width,
+      height: def.height,
+      preserveAspectRatio: def.preserveAspectRatio
+    })
+  );
+  return pattern;
+}
+function appendTitle(doc, el, title) {
+  if (title === void 0) {
+    return;
+  }
+  const titleEl = createSvgEl(doc, "title", {});
+  titleEl.textContent = title;
+  el.appendChild(titleEl);
+}
+function applyPartAttrs(el, part) {
+  if (part) {
+    setSvgAttrs(el, chartPartToAttrs(part));
+  }
+}
+
+// src/pptx/render/chart-view-model-dom.ts
+function renderChartViewModelSvg(doc, vm, preserveAspectRatio) {
+  const svg = createSvgEl(doc, "svg", {
+    class: "pptxv-chart-svg",
+    viewBox: `0 0 ${vm.svgWidth} ${vm.svgHeight}`,
+    preserveAspectRatio
+  });
+  svg.style.setProperty("width", "100%");
+  svg.style.setProperty("height", "100%");
+  svg.style.setProperty("display", "block");
+  if (vm.defs && vm.defs.length > 0) {
+    const defs = createSvgEl(doc, "defs", {});
+    for (const def of vm.defs) {
+      defs.appendChild(renderPatternDef(doc, def));
+    }
+    svg.appendChild(defs);
+  }
+  if (vm.areaFill) {
+    svg.appendChild(
+      createSvgEl(doc, "rect", {
+        x: 0,
+        y: 0,
+        width: vm.svgWidth,
+        height: vm.svgHeight,
+        rx: vm.areaRadius,
+        fill: vm.areaFill
+      })
+    );
+  }
+  if (vm.title) {
+    const title = createSvgEl(doc, "text", {
+      x: vm.titleX,
+      y: vm.titleY,
+      "text-anchor": "middle",
+      "font-size": vm.titleStyle?.fontSize ?? 12,
+      "font-weight": vm.titleStyle?.fontWeight ?? 600,
+      "font-family": vm.titleStyle?.fontFamily,
+      fill: vm.titleStyle?.fill ?? "#1e293b",
+      "data-chart-part": "title"
+    });
+    if (vm.titleRunSpans && vm.titleRunSpans.length > 0) {
+      for (const run of vm.titleRunSpans) {
+        const tspan = createSvgEl(doc, "tspan", {
+          "font-size": run.fontSize,
+          "font-weight": run.fontWeight,
+          "font-style": run.fontStyle,
+          "font-family": run.fontFamily,
+          fill: run.fill
+        });
+        tspan.textContent = run.text;
+        title.appendChild(tspan);
+      }
+    } else {
+      title.textContent = vm.title;
+    }
+    svg.appendChild(title);
+  }
+  for (const gl of vm.gridlines) {
+    svg.appendChild(renderChartLineSvg(doc, gl));
+  }
+  for (const gl of vm.secondaryGridlines ?? []) {
+    svg.appendChild(renderChartLineSvg(doc, gl));
+  }
+  for (const lbl of vm.axisLabels) {
+    svg.appendChild(renderChartTextSvg(doc, lbl));
+  }
+  for (const lbl of vm.secondaryAxisLabels ?? []) {
+    svg.appendChild(renderChartTextSvg(doc, lbl));
+  }
+  if (vm.zeroLine) {
+    svg.appendChild(renderChartLineSvg(doc, vm.zeroLine));
+  }
+  for (const lbl of vm.categoryLabels) {
+    svg.appendChild(renderChartTextSvg(doc, lbl));
+  }
+  for (const prim of vm.primitives) {
+    const node = renderChartPrimitiveSvg(doc, prim);
+    if (node) {
+      svg.appendChild(node);
+    }
+  }
+  for (const dl of vm.dataLabels) {
+    svg.appendChild(renderChartTextSvg(doc, dl));
+  }
+  appendChartLegendSvg(doc, svg, vm);
+  return svg;
+}
+function renderChartPrimitiveSvg(doc, prim) {
+  switch (prim.kind) {
+    case "rect": {
+      const el = createSvgEl(doc, "rect", {
+        x: prim.x,
+        y: prim.y,
+        width: prim.w,
+        height: prim.h,
+        fill: prim.fill,
+        rx: prim.rx ?? 0,
+        opacity: prim.opacity ?? 1
+      });
+      appendTitle(doc, el, prim.title);
+      applyPartAttrs(el, prim.part);
+      return el;
+    }
+    case "path": {
+      const el = createSvgEl(doc, "path", {
+        d: prim.d,
+        fill: prim.fill,
+        stroke: prim.stroke ?? "none",
+        "stroke-width": prim.strokeWidth ?? 0,
+        "stroke-dasharray": prim.dashArray,
+        "fill-opacity": prim.opacity ?? 1
+      });
+      appendTitle(doc, el, prim.title);
+      applyPartAttrs(el, prim.part);
+      return el;
+    }
+    case "polyline": {
+      const el = createSvgEl(doc, "polyline", {
+        points: prim.points,
+        stroke: prim.stroke,
+        "stroke-width": prim.strokeWidth,
+        "stroke-dasharray": prim.dashArray,
+        fill: prim.fill,
+        opacity: prim.opacity ?? 1
+      });
+      appendTitle(doc, el, prim.title);
+      applyPartAttrs(el, prim.part);
+      return el;
+    }
+    case "circle": {
+      const el = createSvgEl(doc, "circle", {
+        cx: prim.cx,
+        cy: prim.cy,
+        r: prim.r,
+        fill: prim.fill,
+        stroke: prim.stroke,
+        "stroke-width": prim.strokeWidth,
+        opacity: prim.opacity ?? 1
+      });
+      appendTitle(doc, el, prim.title);
+      applyPartAttrs(el, prim.part);
+      return el;
+    }
+    case "line":
+      return renderChartLineSvg(doc, prim);
+    case "polygon": {
+      const el = createSvgEl(doc, "polygon", {
+        points: prim.points,
+        fill: prim.fill,
+        stroke: prim.stroke,
+        "stroke-width": prim.strokeWidth,
+        opacity: prim.opacity ?? 1,
+        "stroke-dasharray": prim.dashArray,
+        transform: prim.transform
+      });
+      appendTitle(doc, el, prim.title);
+      applyPartAttrs(el, prim.part);
+      return el;
+    }
+    case "text":
+      return renderChartTextSvg(doc, prim);
+    // Non-visual descriptor (gradient defs); the Vue/React projectors skip
+    // it in their primitive switch as well.
+    case "areaGradient":
+      return null;
+  }
+}
+function renderChartLineSvg(doc, line) {
+  const el = createSvgEl(doc, "line", {
+    x1: line.x1,
+    y1: line.y1,
+    x2: line.x2,
+    y2: line.y2,
+    stroke: line.stroke,
+    "stroke-width": line.strokeWidth,
+    "stroke-dasharray": line.dashArray,
+    opacity: line.opacity ?? 1,
+    transform: line.transform
+  });
+  appendTitle(doc, el, line.title);
+  return el;
+}
+function renderChartTextSvg(doc, text) {
+  const el = createSvgEl(doc, "text", {
+    x: text.x,
+    y: text.y,
+    "text-anchor": text.textAnchor,
+    "font-size": text.fontSize,
+    fill: text.fill,
+    "font-weight": text.fontWeight ?? "normal",
+    "font-style": text.fontStyle ?? "normal",
+    "font-family": text.fontFamily,
+    "dominant-baseline": text.dominantBaseline,
+    opacity: text.opacity ?? 1,
+    transform: text.transform
+  });
+  el.textContent = text.text;
+  return el;
+}
+function appendChartLegendSvg(doc, svg, vm) {
+  computeChartLegendLayout(vm).forEach((item) => {
+    const g = createSvgEl(doc, "g", {
+      class: "pptxv-chart-legend-item",
+      transform: `translate(${item.x.toFixed(1)},${item.y.toFixed(1)})`
+    }), label = createSvgEl(doc, "text", {
+      x: 13,
+      y: 3,
+      "font-size": item.fontSize,
+      fill: item.fill,
+      "font-weight": item.fontWeight,
+      "font-style": item.fontStyle,
+      "font-family": item.fontFamily
+    });
+    if (item.lineSwatch) {
+      for (const prim of item.lineSwatch.primitives) {
+        const node = renderChartPrimitiveSvg(doc, prim);
+        if (node) {
+          g.appendChild(node);
+        }
+      }
+    } else {
+      g.appendChild(
+        createSvgEl(doc, "rect", { x: 0, y: -7, width: 10, height: 10, rx: 2, fill: item.color })
+      );
+    }
+    label.textContent = item.label;
+    g.appendChild(label);
+    svg.appendChild(g);
+  });
+}
+
+// src/pptx/render/chart-3d-persp-oblique.ts
+function perspObliqueCameraFor(box, rotXDeg, rotYDeg) {
+  return {
+    box,
+    yaw: 0,
+    pitch: 0,
+    dist: 1,
+    oblique: {
+      shearX: Math.sin(rotYDeg * Math.PI / 180),
+      shearY: Math.sin(rotXDeg * Math.PI / 180)
+    }
+  };
+}
+function perspObliqueToCamera(box, oblique, p) {
+  const x = p[0] - box.w / 2;
+  const y = p[1] - box.h / 2;
+  const z = p[2] - box.d / 2;
+  return [x + z * oblique.shearX, y + z * oblique.shearY, 1];
+}
+function buildPerspObliqueCamera(three, view, oblique, svgWidth, svgHeight) {
+  const camera = new three.Camera();
+  const reach = Math.hypot(view.box.w, view.box.h, view.box.d);
+  const sx = 2 * view.focal / svgWidth;
+  const sy = 2 * view.focal / svgHeight;
+  camera.projectionMatrix.set(
+    sx,
+    0,
+    sx * oblique.shearX,
+    2 * view.cx / svgWidth - 1,
+    0,
+    sy,
+    sy * oblique.shearY,
+    1 - 2 * view.cy / svgHeight,
+    0,
+    0,
+    1 / reach,
+    0,
+    0,
+    0,
+    0,
+    1
+  );
+  camera.projectionMatrixInverse.copy(camera.projectionMatrix).invert();
+  return camera;
+}
+function perspObliqueBoxMatrix(three, box) {
+  return new three.Matrix4().makeTranslation(-box.w / 2, -box.h / 2, -box.d / 2);
+}
+
+// src/pptx/render/chart-3d-persp-view.ts
+var PERSP_PITCH_PER_ROTX = 0.92;
+var PERSP_DEFAULT_FOV = 30;
+function perspToCamera(camera, p) {
+  if (camera.oblique) {
+    return perspObliqueToCamera(camera.box, camera.oblique, p);
+  }
+  const x = p[0] - camera.box.w / 2;
+  const y = p[1] - camera.box.h / 2;
+  const z = p[2] - camera.box.d / 2;
+  const cy = Math.cos(camera.yaw);
+  const sy = Math.sin(camera.yaw);
+  const cp = Math.cos(camera.pitch);
+  const sp = Math.sin(camera.pitch);
+  const x1 = x * cy + z * sy;
+  const z1 = -x * sy + z * cy;
+  return [x1, y * cp + z1 * sp, z1 * cp - y * sp + camera.dist];
+}
+function perspToScreen(view, p) {
+  const [X, Y, Z] = perspToCamera(view, p);
+  return { x: view.cx + view.focal * X / Z, y: view.cy - view.focal * Y / Z };
+}
+function perspCameraFor(box, rotXDeg, rotYDeg, fovDeg = PERSP_DEFAULT_FOV) {
+  const diagonal = Math.hypot(box.w, box.h, box.d);
+  const fov = Math.min(Math.max(fovDeg, 1), 170);
+  const dist = diagonal / (2 * Math.tan(fov / 2 * Math.PI / 180));
+  return {
+    box,
+    yaw: rotYDeg * Math.PI / 180,
+    pitch: rotXDeg * PERSP_PITCH_PER_ROTX * Math.PI / 180,
+    dist
+  };
+}
+function boxCorners(box) {
+  return Array.from({ length: 8 }, (_, i) => [
+    (i & 1) * box.w,
+    (i >> 1 & 1) * box.h,
+    (i >> 2 & 1) * box.d
+  ]);
+}
+function perspUnitBounds(camera, points = boxCorners(camera.box)) {
+  let minX = Infinity;
+  let maxX = -Infinity;
+  let minY = Infinity;
+  let maxY = -Infinity;
+  for (const p of points) {
+    const [X, Y, Z] = perspToCamera(camera, p);
+    minX = Math.min(minX, X / Z);
+    maxX = Math.max(maxX, X / Z);
+    minY = Math.min(minY, -Y / Z);
+    maxY = Math.max(maxY, -Y / Z);
+  }
+  return { minX, maxX, minY, maxY };
+}
+function fitPerspView(camera, rect, points) {
+  const b = perspUnitBounds(camera, points);
+  const focal = Math.min(
+    (rect.right - rect.left) / (b.maxX - b.minX),
+    (rect.bottom - rect.top) / (b.maxY - b.minY)
+  );
+  return {
+    ...camera,
+    focal,
+    cx: (rect.left + rect.right) / 2 - focal * (b.minX + b.maxX) / 2,
+    cy: (rect.top + rect.bottom) / 2 - focal * (b.minY + b.maxY) / 2
+  };
+}
+function perspScreenToPlaneY(view, sx, sy, y) {
+  const dx = (sx - view.cx) / view.focal;
+  const dy = (view.cy - sy) / view.focal;
+  const cp = Math.cos(view.pitch);
+  const sp = Math.sin(view.pitch);
+  const cyw = Math.cos(view.yaw);
+  const syw = Math.sin(view.yaw);
+  const invPitch = (X, Y, Z) => [
+    X,
+    Y * cp - Z * sp,
+    Y * sp + Z * cp
+  ];
+  const invYaw = (x1, z1) => [
+    x1 * cyw - z1 * syw,
+    x1 * syw + z1 * cyw
+  ];
+  const [ox1, oy, oz1] = invPitch(0, 0, -view.dist);
+  const [dx1, dyb, dz1] = invPitch(dx, dy, 1);
+  const [ox, oz] = invYaw(ox1, oz1);
+  const [ddx, ddz] = invYaw(dx1, dz1);
+  const target = y - view.box.h / 2;
+  if (Math.abs(dyb) < 1e-12) {
+    return null;
+  }
+  const t = (target - oy) / dyb;
+  if (t <= 0) {
+    return null;
+  }
+  return { x: ox + ddx * t + view.box.w / 2, z: oz + ddz * t + view.box.d / 2 };
+}
+function buildPerspCamera(three, view, svgWidth, svgHeight) {
+  if (view.oblique) {
+    return buildPerspObliqueCamera(three, view, view.oblique, svgWidth, svgHeight);
+  }
+  const reach = Math.hypot(view.box.w, view.box.h, view.box.d);
+  const near = Math.max(view.dist - reach, view.dist * 0.05);
+  const far = view.dist + reach;
+  const camera = new three.PerspectiveCamera(30, svgWidth / svgHeight, near, far);
+  camera.projectionMatrix.set(
+    2 * view.focal / svgWidth,
+    0,
+    2 * view.cx / svgWidth - 1,
+    0,
+    0,
+    2 * view.focal / svgHeight,
+    1 - 2 * view.cy / svgHeight,
+    0,
+    0,
+    0,
+    -(far + near) / (far - near),
+    -2 * far * near / (far - near),
+    0,
+    0,
+    -1,
+    0
+  );
+  const e = camera.projectionMatrix.elements;
+  e[8] = -e[8];
+  e[9] = -e[9];
+  camera.projectionMatrixInverse.copy(camera.projectionMatrix).invert();
+  return camera;
+}
+function perspBoxMatrix(three, view) {
+  if (view.oblique) {
+    return perspObliqueBoxMatrix(three, view.box);
+  }
+  const { w, h, d } = view.box;
+  return new three.Matrix4().makeScale(1, 1, -1).multiply(new three.Matrix4().makeTranslation(0, 0, view.dist)).multiply(new three.Matrix4().makeRotationX(-view.pitch)).multiply(new three.Matrix4().makeRotationY(view.yaw)).multiply(new three.Matrix4().makeTranslation(-w / 2, -h / 2, -d / 2));
+}
+
+// src/pptx/render/chart-3d-pie-layout.ts
+var PT = 4 / 3;
+var PIE_THICKNESS = 0.23;
+var PIE_PITCH_PER_ROTX = 0.91;
+var PIE_CAMERA_DIAGONALS = 1.38;
+var RECT_MARGIN = 18 * PT;
+var RECT_TOP_WITH_TITLE = 48 * PT;
+var RECT_TOP_NO_TITLE = 14 * PT;
+var RECT_BOTTOM_WITH_LEGEND = 44 * PT;
+var RECT_BOTTOM_NO_LEGEND = 14 * PT;
+var RIM_SAMPLES = 96;
+function pieRimPoint(cx, cz, radius, angle) {
+  return { x: cx + radius * Math.sin(angle), z: cz + radius * Math.cos(angle) };
+}
+function widenPieViewModel(vm, element) {
+  const width = vm.svgHeight * (element.width / Math.max(element.height, 1));
+  const dx = (width - vm.svgWidth) / 2;
+  if (Math.abs(dx) < 1e-6) {
+    return vm;
+  }
+  return {
+    ...vm,
+    svgWidth: width,
+    titleX: vm.titleX + dx,
+    legendX: vm.legendAnchor === "middle" ? vm.legendX + dx : vm.legendX
+  };
+}
+function computePieChartLayout(element, vm) {
+  if (element.type !== "chart" || !element.chartData) {
+    return null;
+  }
+  const chartData = element.chartData;
+  const series = chartData.series[0];
+  if (!series || series.values.length === 0) {
+    return null;
+  }
+  const view3D = chartData.view3D;
+  const thickness = PIE_THICKNESS * ((view3D?.hPercent ?? 100) / 100);
+  const box = { w: 2, h: thickness, d: 2 };
+  const camera = perspCameraFor(box, 0, view3D?.rotY ?? 0);
+  camera.pitch = (view3D?.rotX ?? 30) * PIE_PITCH_PER_ROTX * Math.PI / 180;
+  camera.dist = PIE_CAMERA_DIAGONALS * Math.hypot(box.w, box.h, box.d);
+  const rim = [];
+  for (let i = 0; i < RIM_SAMPLES; i++) {
+    const a = i / RIM_SAMPLES * Math.PI * 2;
+    const p = pieRimPoint(1, 1, 1, a);
+    rim.push([p.x, 0, p.z], [p.x, box.h, p.z]);
+  }
+  const hasLegend = chartData.style?.hasLegend !== false && (chartData.style?.legendPosition ?? "b") === "b";
+  const view = fitPerspView(
+    camera,
+    {
+      left: RECT_MARGIN,
+      right: vm.svgWidth - RECT_MARGIN,
+      top: vm.title ? RECT_TOP_WITH_TITLE : RECT_TOP_NO_TITLE,
+      bottom: vm.svgHeight - (hasLegend ? RECT_BOTTOM_WITH_LEGEND : RECT_BOTTOM_NO_LEGEND)
+    },
+    rim
+  );
+  const explosionOf = (i) => Math.max(
+    0,
+    (series.dataPoints?.find((d) => d.idx === i)?.explosion ?? series.explosion ?? 0) / 100
+  );
+  const values = series.values.map((v) => Number.isFinite(v) ? Math.abs(v) : 0);
+  const maxExplosion = values.reduce((m, _v, i) => Math.max(m, explosionOf(i)), 0);
+  const radius = 1 / (1 + maxExplosion);
+  const total = values.reduce((t, v) => t + v, 0) || 1;
+  let angle = (chartData.firstSliceAngle ?? 0) * Math.PI / 180;
+  const slices = values.map((value, i) => {
+    const startAngle = angle;
+    const endAngle = angle + value / total * Math.PI * 2;
+    angle = endAngle;
+    const mid = (startAngle + endAngle) / 2;
+    const out = explosionOf(i) * radius;
+    return {
+      pointIndex: i,
+      value: series.values[i],
+      color: vm.legend[i]?.color ?? "#4472c4",
+      startAngle,
+      endAngle,
+      offset: { x: out * Math.sin(mid), z: out * Math.cos(mid) }
+    };
+  });
+  return {
+    view,
+    center: { x: 1, y: box.h * radius, z: 1 },
+    radius,
+    thickness: box.h * radius,
+    slices
+  };
+}
+
+// src/pptx/render/bar-chart-3d-hit-test.ts
+function buildBarChart3DHoverTooltip(hit, data) {
+  if (!hit) {
+    return void 0;
+  }
+  return buildMarkTooltip(
+    data.seriesNames[hit.seriesIndex],
+    data.categoryLabels[hit.categoryIndex],
+    hit.value,
+    data.numberFormats?.[hit.seriesIndex]
+  );
+}
+
+// src/pptx/render/chart-3d-oblique-bars.ts
+function formatValueLabel(chartData, grouping, v) {
+  if (grouping === "percentStacked") {
+    return `${Math.round(v * 100)}%`;
+  }
+  return formatAxisValueWithUnits(
+    v,
+    chartData.axes?.find((a) => a.axisType === "valAx")
+  );
+}
+function obliqueBarTaper(shape, lo, hi, extent, value) {
+  switch (shape) {
+    case "cone":
+    case "pyramid":
+      return value >= 0 ? { bottom: 1, top: 0 } : { bottom: 0, top: 1 };
+    case "coneToMax":
+    case "pyramidToMax": {
+      const at = (p) => Math.min(1, Math.max(0, 1 - p / Math.max(extent, 1e-9)));
+      return { bottom: at(lo), top: at(hi) };
+    }
+    default:
+      return { bottom: 1, top: 1 };
+  }
+}
+function valuePos(layout, v) {
+  return (v - layout.range.min) * layout.valueScale;
+}
+function buildBars(chartData, vm, layout, dims) {
+  const catExtent = layout.horizontal ? layout.box.h : layout.box.w;
+  const catWidth = catExtent / dims.nCat;
+  const barW = catWidth / (dims.slots + dims.gapWidth);
+  const rowDepth = barW * (1 + dims.gapDepth);
+  const colors = seriesColors(chartData, vm);
+  const valueExtent = layout.horizontal ? layout.box.w : layout.box.h;
+  const baseline = Math.min(Math.max(0, layout.range.min), layout.range.max);
+  const bars = [];
+  for (let c = 0; c < dims.nCat; c++) {
+    let pos = baseline;
+    let neg = baseline;
+    const total = chartData.series.reduce((sum, s) => sum + Math.abs(s.values[c] ?? 0), 0);
+    chartData.series.forEach((series, s) => {
+      const raw = series.values[c];
+      if (raw === void 0 || Number.isNaN(raw)) {
+        return;
+      }
+      const value = layout.grouping === "percentStacked" ? total ? raw / total : 0 : raw;
+      let from = baseline;
+      let to = value;
+      if (layout.grouping === "stacked" || layout.grouping === "percentStacked") {
+        from = value >= 0 ? pos : neg;
+        to = from + value;
+        if (value >= 0) {
+          pos = to;
+        } else {
+          neg = to;
+        }
+      }
+      const shape = series.shape ?? chartData.barShape ?? "box";
+      const slot = layout.grouping === "clustered" ? s : 0;
+      const row = layout.grouping === "standard" ? s : 0;
+      const catStart = c * catWidth + dims.gapWidth * barW / 2 + slot * barW;
+      const lo = valuePos(layout, Math.max(Math.min(from, to), layout.range.min));
+      const hi = valuePos(layout, Math.min(Math.max(from, to), layout.range.max));
+      const z = row * rowDepth + (rowDepth - barW) / 2;
+      const along = layout.horizontal ? { x: lo, w: Math.max(hi - lo, 0), y: catStart, h: barW } : { x: catStart, w: barW, y: lo, h: Math.max(hi - lo, 0) };
+      bars.push({
+        ...along,
+        z,
+        d: barW,
+        color: colors[s],
+        seriesIndex: s,
+        categoryIndex: c,
+        value: raw,
+        shape,
+        taper: obliqueBarTaper(shape, lo, hi, valueExtent, raw)
+      });
+    });
+  }
+  return bars;
+}
+function seriesColors(chartData, vm) {
+  return chartData.series.map(
+    (s, i) => vm.legend.find((entry) => entry.label === s.name)?.color ?? vm.legend[i]?.color ?? "#4472c4"
+  );
+}
+function buildGridlines(layout) {
+  const { w, h, d } = layout.box;
+  const lines = [];
+  const span = layout.range.max - layout.range.min;
+  for (const v of axisTickValues({ ...layout.range, span })) {
+    const p = valuePos(layout, v);
+    if (layout.horizontal) {
+      lines.push({ from: [p, 0, d], to: [p, h, d] }, { from: [p, 0, 0], to: [p, 0, d] });
+    } else {
+      lines.push({ from: [0, p, d], to: [w, p, d] }, { from: [0, p, 0], to: [0, p, d] });
+    }
+  }
+  return lines;
+}
+
+export { CHART_DRAG_THRESHOLD_PX, CHART_INTERACTIVE_CLASS, CHART_PART_ATTR, CHART_PART_POINT_ATTR, CHART_PART_SELECTED_CLASS, CHART_PART_SERIES_ATTR, advanceChartValueDrag, appendChartLegendSvg, applyChartPartHighlight, beginChartValueDrag, buildBarChart3DHoverTooltip, buildBars, buildChartMarkDragGeometry, buildGridlines, buildPerspCamera, buildPieDragGeometry, buildRadarDragGeometry, buildStackedDragGeometry, chartPartFromElement, chartPartToAttrs, computeChartLegendLayout, computePieChartLayout, createSvgEl, dragAnchorViewY, dragValueForPart, ensureChartInteractionStyles, findChartPartTarget, fitPerspView, formatValueLabel, isChartInteractionArmed, isSameChartPart, obliqueBarTaper, perspBoxMatrix, perspCameraFor, perspObliqueCameraFor, perspScreenToPlaneY, perspToScreen, pieRimPoint, renderChartLineSvg, renderChartPrimitiveSvg, renderChartTextSvg, renderChartViewModelSvg, resolveChartDragValue, resolvePieDragValue, resolvePieSliceShareValue, resolveRadarDragValue, resolveStackedDragValue, roundDragValue, shareToValue, valueFromY, widenPieViewModel, withChartPointValue, withChartTitle };