pptx-vue-viewer 1.22.0 → 1.22.1

package/CHANGELOG.md

@@ -4,6 +4,8 @@ All notable changes to this project are documented here.
 This file is generated from [Conventional Commits](https://www.conventionalcommits.org)
 by [git-cliff](https://git-cliff.org); do not edit it by hand.
 
+## [1.22.0](https://github.com/ChristopherVR/pptx-viewer/releases/tag/pptx-vue-viewer@1.22.0) - 2026-07-18
+
 ## [1.21.0](https://github.com/ChristopherVR/pptx-viewer/releases/tag/pptx-vue-viewer@1.21.0) - 2026-07-17
 
 ### Features

package/dist/index.cjs

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const e = require("./useViewerSettingsDialog-CvBIvcW0.cjs"), o = require("./viewer-CNhkzhvY.cjs");
+const e = require("./useViewerSettingsDialog-CvBIvcW0.cjs"), o = require("./viewer-BevWmHKj.cjs");
 exports.AUDIENCE_HASH = o.AUDIENCE_HASH, exports.CollaborationCursors = o.CollaborationCursors_default, exports.CollaborationStatusIndicator = o.CollaborationStatusIndicator_default, exports.ElementRenderer = o.ElementRenderer_default, exports.FollowModeBar = o.FollowModeBar_default, exports.PowerPointViewer = o.PowerPointViewer_default, exports.RemoteSelectionOverlay = o.RemoteSelectionOverlay_default, exports.SlideCanvas = o.SlideCanvas_default, exports.SlideStage = o.SlideStage_default, exports.clearAudienceContent = o.clearAudienceContent, exports.cn = o.cn, exports.defaultCssVars = e.defaultCssVars, exports.defaultRadius = e.defaultRadius, exports.defaultThemeColors = e.defaultThemeColors, exports.exportAllSlidesToSvg = e.exportAllSlidesToSvg, exports.exportAllSlidesToSvgBlobs = e.exportAllSlidesToSvgBlobs, exports.exportSlideToSvg = e.exportSlideToSvg, exports.exportSlideToSvgBlob = e.exportSlideToSvgBlob, exports.isAudienceTab = o.isAudienceTab, exports.loadAudienceContent = o.loadAudienceContent, exports.parsePresentationSessionId = e.parsePresentationSessionId, exports.provideViewerTheme = o.provideViewerTheme, exports.storeAudienceContent = o.storeAudienceContent, exports.themeToCssVars = e.themeToCssVars, exports.useCollaboration = e.useCollaboration, exports.useCollaborationWiring = e.useCollaborationWiring, exports.useThemeStyle = o.useThemeStyle, exports.useViewerTheme = o.useViewerTheme, exports.vermilionDarkColors = e.vermilionDarkColors, exports.vermilionDarkTheme = e.vermilionDarkTheme, exports.vermilionLightColors = e.vermilionLightColors, exports.vermilionLightTheme = e.vermilionLightTheme, exports.vermilionRadius = e.vermilionRadius;

package/dist/index.js

@@ -1,3 +1,3 @@
 import { C as a, Di as s, Ei as o, Go as e, Ko as r, Ro as i, S as t, Uo as l, Wo as n, at as S, b as d, it as m, ki as w, qo as C, ro as p, x as u } from "./useViewerSettingsDialog-CkY4fSDh.js";
-import { A as b, M as c, O as f, a as g, c as j, d as v, f as R, i as k, j as x, k as D, n as E, o as M, p as O, r as P, s as V, t as q, u as y } from "./viewer-CBbNiJ9q.js";
+import { A as b, M as c, O as f, a as g, c as j, d as v, f as R, i as k, j as x, k as D, n as E, o as M, p as O, r as P, s as V, t as q, u as y } from "./viewer-CHxMlR5-.js";
 export { k as AUDIENCE_HASH, D as CollaborationCursors, f as CollaborationStatusIndicator, O as ElementRenderer, v as FollowModeBar, q as PowerPointViewer, P as RemoteSelectionOverlay, E as SlideCanvas, R as SlideStage, g as clearAudienceContent, y as cn, o as defaultCssVars, s as defaultRadius, w as defaultThemeColors, d as exportAllSlidesToSvg, u as exportAllSlidesToSvgBlobs, t as exportSlideToSvg, a as exportSlideToSvgBlob, M as isAudienceTab, V as loadAudienceContent, p as parsePresentationSessionId, b as provideViewerTheme, j as storeAudienceContent, i as themeToCssVars, S as useCollaboration, m as useCollaborationWiring, x as useThemeStyle, c as useViewerTheme, l as vermilionDarkColors, n as vermilionDarkTheme, e as vermilionLightColors, r as vermilionLightTheme, C as vermilionRadius };

package/dist/viewer/components/SlideStage.vue.d.ts

@@ -12,6 +12,15 @@ import { CanvasSize } from '../types';
  * slide content (lower z), supplied separately via `templateElements`. They are
  * interactive (and gain the editable affordance) only while `editTemplateMode`
  * is on; otherwise they render but are locked.
+ *
+ * Accessibility contract: exactly ONE `aria-roledescription="slide"` region
+ * exists per surface. On the editable canvas that region is the `SlideCanvas`
+ * wrapper (which also paints the resolved background), mirroring React's
+ * `SlideCanvas.tsx`, so the interactive stage itself stays unlabelled. Only the
+ * standalone live presentation stage (`presenting`, no wrapper) self-labels.
+ * Static stages (thumbnails, sorter, previews, export) are `aria-hidden` and
+ * additionally have their `data-element-id` markers stripped post-render (see
+ * `stripElementIdMarkers`) so element queries always hit the real canvas copy.
  */
 type __VLS_Props = {
     slide: PptxSlide | undefined;

package/dist/viewer/components/SlideStage.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SlideStage.vue.d.ts","sourceRoot":"","sources":["../../../src/viewer/components/SlideStage.vue"],"names":[],"mappings":"AAgIA,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAM/D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAG3C;;;;;;;;;;;;GAYG;AACH,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,SAAS,GAAG,SAAS,CAAC;IAC7B,UAAU,EAAE,UAAU,CAAC;IACvB,aAAa,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sFAAsF;IACtF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,WAAW,EAAE,CAAC;IACjC;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AA2HH,QAAA,IAAI,QAAQ,IAAY,CAAE;AAC1B,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAOhD,QAAA,MAAM,UAAU;WAxJN,MAAM;6EA2Jd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"SlideStage.vue.d.ts","sourceRoot":"","sources":["../../../src/viewer/components/SlideStage.vue"],"names":[],"mappings":"AAsJA,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAO/D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAG3C;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,SAAS,GAAG,SAAS,CAAC;IAC7B,UAAU,EAAE,UAAU,CAAC;IACvB,aAAa,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sFAAsF;IACtF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,WAAW,EAAE,CAAC;IACjC;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAuIH,QAAA,IAAI,QAAQ,IAAY,CAAE;AAC1B,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAOhD,QAAA,MAAM,UAAU;WApKN,MAAM;6EAuKd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/viewer/composables/stage-element-markers.d.ts

@@ -0,0 +1,25 @@
+/**
+ * stage-element-markers: DOM post-pass that removes the `data-element-id`
+ * query/interaction markers from a static stage subtree.
+ *
+ * Only the primary editable canvas and the live presentation stage may expose
+ * `data-element-id` hooks. Thumbnails, the slide sorter, version previews,
+ * master views, transition snapshots, and the off-screen export stage render
+ * the exact same element tree, but must not leak the markers: both the e2e
+ * contract (`page.locator('[data-element-id]').first()` is the real canvas
+ * element) and internal `document.querySelectorAll('[data-element-id]')`
+ * consumers (animation preview, delegation fallbacks) rely on the first match
+ * being the interactive copy. React reaches the same DOM contract by rendering
+ * its static surfaces through a marker-free `StaticElementRenderer`; this
+ * post-pass (run from `SlideStage`'s existing post-render effect, the same
+ * boundary that applies element accessibility) gives Vue identical semantics
+ * without threading a prop through every element renderer.
+ *
+ * Safe against re-renders: Vue's patcher only rewrites a DOM attribute when
+ * the bound vnode prop value changes, and an element's `id` is stable, so a
+ * stripped attribute is not re-added by unrelated updates. Structural changes
+ * (elements added/removed/replaced) change the reactive element list, which
+ * re-triggers the owning effect and re-strips.
+ */
+export declare function stripElementIdMarkers(stage: ParentNode): number;
+//# sourceMappingURL=stage-element-markers.d.ts.map

package/dist/viewer/composables/stage-element-markers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stage-element-markers.d.ts","sourceRoot":"","sources":["../../../src/viewer/composables/stage-element-markers.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,UAAU,GAAG,MAAM,CAM/D"}

package/dist/viewer/index.cjs

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const e = require("../useViewerSettingsDialog-CvBIvcW0.cjs"), t = require("../viewer-CNhkzhvY.cjs");
+const e = require("../useViewerSettingsDialog-CvBIvcW0.cjs"), t = require("../viewer-BevWmHKj.cjs");
 exports.AUDIENCE_HASH = t.AUDIENCE_HASH, exports.ChartRenderer = t.ChartRenderer_default, exports.CollaborationCursors = t.CollaborationCursors_default, exports.CollaborationStatusIndicator = t.CollaborationStatusIndicator_default, exports.ConnectorRenderer = t.ConnectorRenderer_default, exports.DEFAULT_CANVAS_HEIGHT = e.DEFAULT_CANVAS_HEIGHT, exports.DEFAULT_CANVAS_WIDTH = e.DEFAULT_CANVAS_WIDTH, exports.DEFAULT_FILL_COLOR = e.DEFAULT_FILL_COLOR, exports.DEFAULT_STROKE_COLOR = e.DEFAULT_STROKE_COLOR, exports.DEFAULT_TEXT_COLOR = e.DEFAULT_TEXT_COLOR, exports.ElementRenderer = t.ElementRenderer_default, exports.EquationRenderer = t.EquationRenderer_default, exports.FollowModeBar = t.FollowModeBar_default, exports.InkRenderer = t.InkRenderer_default, exports.Model3DRenderer = t.Model3DRenderer_default, exports.OleRenderer = t.OleRenderer_default, exports.PowerPointViewer = t.PowerPointViewer_default, exports.RemoteSelectionOverlay = t.RemoteSelectionOverlay_default, exports.SlideCanvas = t.SlideCanvas_default, exports.SlideStage = t.SlideStage_default, exports.SmartArtRenderer = t.SmartArtRenderer_default, exports.TableRenderer = t.TableRenderer_default, exports.WordArtText = t.WordArtText_default, exports.ZoomRenderer = t.ZoomRenderer_default, exports.buildInitialGuides = e.buildInitialGuides, exports.clearAudienceContent = t.clearAudienceContent, exports.collectImagePaths = e.collectImagePaths, exports.collectMediaElements = e.collectMediaElements, exports.exportAllSlidesToSvg = e.exportAllSlidesToSvg, exports.exportAllSlidesToSvgBlobs = e.exportAllSlidesToSvgBlobs, exports.exportSlideToSvg = e.exportSlideToSvg, exports.exportSlideToSvgBlob = e.exportSlideToSvgBlob, exports.getContainerStyle = t.getContainerStyle, exports.getImageSrc = t.getImageSrc, exports.getResolvedShapeClipPath = e.getResolvedShapeClipPath, exports.getResolvedShapeClipPathFor = e.getResolvedShapeClipPathFor, exports.getShapeFillStrokeStyle = t.getShapeFillStrokeStyle, exports.getTextBlockStyle = t.getTextBlockStyle, exports.isAudienceTab = t.isAudienceTab, exports.loadAudienceContent = t.loadAudienceContent, exports.storeAudienceContent = t.storeAudienceContent, exports.useCollaboration = e.useCollaboration, exports.useCollaborationWiring = e.useCollaborationWiring, exports.useEditorHistory = e.useEditorHistory, exports.useEditorOperations = e.useEditorOperations, exports.useLoadContent = e.useLoadContent, exports.useToolbarVisibility = t.useToolbarVisibility;

package/dist/viewer/index.js

@@ -1,3 +1,3 @@
 import { C as a, J as s, S as e, Sa as r, X as o, at as n, b as t, dn as i, ei as d, fn as l, it as R, jr as m, k as S, mn as C, pn as w, ti as b, un as p, x as u, xa as x } from "../useViewerSettingsDialog-CkY4fSDh.js";
-import { C as c, D as f, E as g, O as v, S as j, T as k, _ as D, a as E, b as O, c as T, d as h, f as y, g as A, h as I, i as M, k as P, l as V, m as q, n as B, o as F, p as J, r as W, s as X, t as Z, v as _, w as z, x as G, y as H } from "../viewer-CBbNiJ9q.js";
+import { C as c, D as f, E as g, O as v, S as j, T as k, _ as D, a as E, b as O, c as T, d as h, f as y, g as A, h as I, i as M, k as P, l as V, m as q, n as B, o as F, p as J, r as W, s as X, t as Z, v as _, w as z, x as G, y as H } from "../viewer-CHxMlR5-.js";
 export { M as AUDIENCE_HASH, c as ChartRenderer, P as CollaborationCursors, v as CollaborationStatusIndicator, j as ConnectorRenderer, p as DEFAULT_CANVAS_HEIGHT, i as DEFAULT_CANVAS_WIDTH, l as DEFAULT_FILL_COLOR, w as DEFAULT_STROKE_COLOR, C as DEFAULT_TEXT_COLOR, J as ElementRenderer, G as EquationRenderer, h as FollowModeBar, O as InkRenderer, H as Model3DRenderer, _ as OleRenderer, Z as PowerPointViewer, W as RemoteSelectionOverlay, B as SlideCanvas, y as SlideStage, D as SmartArtRenderer, A as TableRenderer, I as WordArtText, q as ZoomRenderer, m as buildInitialGuides, E as clearAudienceContent, d as collectImagePaths, b as collectMediaElements, t as exportAllSlidesToSvg, u as exportAllSlidesToSvgBlobs, e as exportSlideToSvg, a as exportSlideToSvgBlob, z as getContainerStyle, k as getImageSrc, x as getResolvedShapeClipPath, r as getResolvedShapeClipPathFor, g as getShapeFillStrokeStyle, f as getTextBlockStyle, F as isAudienceTab, X as loadAudienceContent, T as storeAudienceContent, n as useCollaboration, R as useCollaborationWiring, o as useEditorHistory, s as useEditorOperations, S as useLoadContent, V as useToolbarVisibility };

package/dist/{viewer-CNhkzhvY.cjs → viewer-BevWmHKj.cjs}

@@ -4795,7 +4795,12 @@ var $a, Ka = [
 	setup(e) {
 		const t = e, { t: o } = n.useI18n(), a = (0, l.ref)(null), r = (0, l.computed)(() => t.templateElements ?? []), i = (0, l.computed)(() => r.value.length), s = (0, l.computed)(() => [...r.value, ...t.slide?.elements ?? []]);
 		(0, l.watchPostEffect)(() => {
-			a.value && (t.interactive || t.presenting) && n.applyRenderedElementAccessibility(a.value, s.value);
+			const e = a.value, o = s.value;
+			e && (t.interactive || t.presenting ? n.applyRenderedElementAccessibility(e, o) : function(e) {
+				const t = e.querySelectorAll("[data-element-id]");
+				for (const e of t) e.removeAttribute("data-element-id");
+				t.length;
+			}(e));
 		});
 		const c = (0, l.computed)(() => (t.interactive ?? !1) && (t.editTemplateMode ?? !1)), p = (0, l.computed)(() => ({
 			width: `${t.canvasSize.width}px`,
@@ -4811,9 +4816,9 @@ var $a, Ka = [
 			ref: a,
 			class: "pptx-vue-stage",
 			style: (0, l.normalizeStyle)(p.value),
-			role: e.interactive || e.presenting ? "region" : void 0,
-			"aria-roledescription": e.interactive || e.presenting ? "slide" : void 0,
-			"aria-label": e.interactive || e.presenting ? (0, l.unref)(o)("pptx.canvas.slide") : void 0,
+			role: e.presenting ? "region" : void 0,
+			"aria-roledescription": e.presenting ? "slide" : void 0,
+			"aria-label": e.presenting ? (0, l.unref)(o)("pptx.canvas.slide") : void 0,
 			"aria-hidden": e.interactive || e.presenting ? void 0 : "true"
 		}, [
 			((0, l.openBlock)(!0), (0, l.createElementBlock)(l.Fragment, null, (0, l.renderList)(r.value, (t, n) => ((0, l.openBlock)(), (0, l.createBlock)(lr, {
@@ -13563,7 +13568,7 @@ var IB = ["aria-label"], _B = ["disabled", "aria-label"], AB = ["disabled", "ari
 			(0, l.createElementVNode)("span", xV, (0, l.toDisplayString)(t.drawingWidth), 1)
 		], 8, mV)])], 64));
 	}
-}), gV = "1.21.0", yV = Symbol("pptx-account-auth");
+}), gV = "1.22.0", yV = Symbol("pptx-account-auth");
 var bV = { class: "pptx-vue-account mt-8 flex max-w-[760px] flex-col gap-6" }, hV = { class: "pptx-vue-account-section border border-border bg-card p-6 text-card-foreground" }, kV = { class: "text-base font-semibold" }, EV = { class: "mt-4 flex items-center gap-4" }, SV = { class: "min-w-0 flex-1" }, CV = { class: "block text-xs font-medium text-muted-foreground" }, wV = ["value", "placeholder"], BV = { class: "mt-4" }, NV = { class: "block text-xs font-medium text-muted-foreground" }, VV = { class: "mt-2 flex gap-2" }, DV = [
 	"aria-pressed",
 	"aria-label",

package/dist/{viewer-CBbNiJ9q.js → viewer-CHxMlR5-.js}

@@ -4796,7 +4796,12 @@ var Wx, Gx = [
 	setup(e) {
 		const t = e, { t: a } = mn(), n = Yl(null), o = Tl(() => t.templateElements ?? []), l = Tl(() => o.value.length), r = Tl(() => [...o.value, ...t.slide?.elements ?? []]);
 		cr(() => {
-			n.value && (t.interactive || t.presenting) && ol(n.value, r.value);
+			const e = n.value, a = r.value;
+			e && (t.interactive || t.presenting ? ol(e, a) : function(e) {
+				const t = e.querySelectorAll("[data-element-id]");
+				for (const e of t) e.removeAttribute("data-element-id");
+				t.length;
+			}(e));
 		});
 		const i = Tl(() => (t.interactive ?? !1) && (t.editTemplateMode ?? !1)), s = Tl(() => ({
 			width: `${t.canvasSize.width}px`,
@@ -4812,9 +4817,9 @@ var Wx, Gx = [
 			ref: n,
 			class: "pptx-vue-stage",
 			style: $l(s.value),
-			role: e.interactive || e.presenting ? "region" : void 0,
-			"aria-roledescription": e.interactive || e.presenting ? "slide" : void 0,
-			"aria-label": e.interactive || e.presenting ? nr(a)("pptx.canvas.slide") : void 0,
+			role: e.presenting ? "region" : void 0,
+			"aria-roledescription": e.presenting ? "slide" : void 0,
+			"aria-label": e.presenting ? nr(a)("pptx.canvas.slide") : void 0,
 			"aria-hidden": e.interactive || e.presenting ? void 0 : "true"
 		}, [
 			(Wl(!0), El(Sl, null, Xl(o.value, (t, a) => (Wl(), Fl(sv, {
@@ -13564,7 +13569,7 @@ var UD = ["aria-label"], $D = ["disabled", "aria-label"], KD = ["disabled", "ari
 			Il("span", fO, tr(t.drawingWidth), 1)
 		], 8, yO)])], 64));
 	}
-}), wO = "1.21.0", SO = Symbol("pptx-account-auth");
+}), wO = "1.22.0", SO = Symbol("pptx-account-auth");
 var CO = { class: "pptx-vue-account mt-8 flex max-w-[760px] flex-col gap-6" }, TO = { class: "pptx-vue-account-section border border-border bg-card p-6 text-card-foreground" }, FO = { class: "text-base font-semibold" }, PO = { class: "mt-4 flex items-center gap-4" }, EO = { class: "min-w-0 flex-1" }, IO = { class: "block text-xs font-medium text-muted-foreground" }, _O = ["value", "placeholder"], AO = { class: "mt-4" }, MO = { class: "block text-xs font-medium text-muted-foreground" }, zO = { class: "mt-2 flex gap-2" }, BO = [
 	"aria-pressed",
 	"aria-label",

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "pptx-vue-viewer",
-	"version": "1.22.0",
+	"version": "1.22.1",
 	"description": "Vue 3 PowerPoint viewer and editor component: render, edit, and export PPTX slides in the browser.",
 	"keywords": [
 		"editor",