Skip to content

Composables

PowerPointViewer.vue is a thin <script setup> orchestrator. Almost all of its logic lives in 70+ custom composables under viewer/composables/, composed inside the component, while the visual components are largely presentational. State is held entirely in Vue's reactivity system, there is no external state library.

Internal vs public vs unstable

Most of these composables are internal architecture: they assume a specific composition order and shared inputs. A small curated subset is exported from pptx-vue-viewer/viewer with a normal semver-stable API. The complete set, every composable listed below, is also importable from pptx-vue-viewer/composables-unstable, but with no compatibility guarantees: see Complete Composables Reference. The tables below mark which category each composable falls into.

Architecture (internal)

These composables describe how the viewer is wired. They are importable (see below) but assume a specific composition order and shared inputs, treat this table as conceptual reference, not an API contract.

ComposableConcern
useLoadContentParses the PPTX buffer on load via PptxHandler.
useEditorHistoryUndo/redo snapshot stack, aware of the template (master/layout) element layer.
useEditorOperationsElement create/update/delete/duplicate primitives.
useElementDragMove / resize / rotate / adjust, plus snap & alignment guides.
useElementInsertionShape / image / text box / table / chart insertion.
useSlideOperationsAdd / delete / duplicate / reorder slides.
useAutosaveDebounced autosave timer + status (see Props > Autosave).
usePresentationModeWiringSlideshow navigation wiring into the component.
useExportWiringPNG / PDF / GIF / WebM export + print, wired into the component.
useCollaborationWiringShare/Broadcast dialog + prop-driven Yjs session lifecycle.
useRibbonPropsComposes the full Office-ribbon RibbonProps contract.
useEditorKeyboardConfig-driven keyboard-shortcut registry + dispatch.
useIsMobileDevice/viewport classification (mobile/tablet/orientation).

There are dozens more (dialogs, comments, sections, SmartArt editing, table editing, presentation sub-composables, mobile chrome, etc.). See the Complete Composables Reference for the full list, grouped by concern, and how to import all of them from pptx-vue-viewer/composables-unstable.

Public composables

The following are exported from pptx-vue-viewer/viewer (and the root pptx-vue-viewer entry) and are safe to import. They are opt-in and tree-shakeable.

ts
import { useLoadContent, useEditorHistory, useEditorOperations } from 'pptx-vue-viewer/viewer';
ComposableExported type(s)Purpose
useLoadContentUseLoadContentResultParse a .pptx buffer via PptxHandler and expose reactive state.
useEditorHistory-Undo/redo snapshot stack.
useEditorOperations-Element create/update/delete primitives.

Alongside these, pptx-vue-viewer/viewer also exports a handful of pure helper functions (not composables) used by the renderer components: getContainerStyle, getShapeFillStrokeStyle, getTextBlockStyle, getImageSrc, getResolvedShapeClipPath, getResolvedShapeClipPathFor, collectMediaElements, collectImagePaths, buildInitialGuides, plus the audience/presenter content-sharing helpers (isAudienceTab, storeAudienceContent, loadAudienceContent, clearAudienceContent).

No public collaboration composables or presence UI yet

Unlike the React binding (which exports useYjsProvider, usePresenceTracking, useCollaborativeState, CollaborationProvider, RemoteUserCursors, etc. from pptx-react-viewer/viewer), the Vue package does not yet expose a curated collaboration surface or dedicated cursor/avatar components from /viewer. The underlying useCollaboration and useCollaborationWiring composables and the CollaborationCursors.vue / CollaborationStatusIndicator.vue components are internal; reach them via pptx-vue-viewer/composables-unstable if you need to build custom collaboration UI. See Collaboration.

Using an internal composable directly

If the curated public composables above don't cover what you need, every internal composable is also importable in full from pptx-vue-viewer/composables-unstable:

ts
import { useEditorHistory, useAlignGroup } from 'pptx-vue-viewer/composables-unstable';

No compatibility guarantees

pptx-vue-viewer/composables-unstable re-exports the same composables PowerPointViewer.vue composes internally (directly, or via a wiring composable used by a child component), unmodified. They are not part of the package's semver contract: signatures and behavior can change, and composables can be renamed or removed, in any release including a patch release. Prefer the props/defineExpose API or the curated pptx-vue-viewer/viewer composables first; reach for this only for advanced integrations, and pin an exact version if you depend on it.

See the Complete Composables Reference for the full list and Overview for the broader architectural picture.

Released under the Apache-2.0 License.