Introduction
Composable primitives for viewing and editing PowerPoint presentations.
This is a library for viewing and editing PowerPoint presentations in the browser.
Features
- Rendering: Shapes, preset and custom geometries, gradients, pattern fills, shadows, tables, charts, images, and embedded fonts.
- Editing: Move, resize (with aspect-ratio lock), multi-select, marquee, inline text editing, and full undo/redo.
- Keyboard shortcuts: Arrow nudge, Delete, Escape, and Ctrl/Cmd+A matching PowerPoint behavior, plus opt-in Ctrl/Cmd+Z/Y.
- Embedded fonts: Decodes and registers ODTTF/MTX fonts from the PPTX so slides render with the original typefaces.
- Thumbnail strip: Slide list with lazy miniature rendering and a shared render queue so large decks never block the main thread.
- Auto-fit zoom: Slide scales to fill the viewport and re-fits on window resize.
- Lossless save: Round-trips untouched parts byte-for-byte; only edited slides are re-serialized.
- Composable API: Primitive components you assemble like shadcn/ui. Bring your own layout and styles.
Packages
| Package | Description |
|---|---|
@diceui/pptx | Composable primitives for viewing and editing PowerPoint presentations in the browser |
@diceui/pptx-core | PPTX engine for parsing, rendering, editing, and saving PowerPoint presentations in the browser |
Architecture
The library is split into two layers, so @diceui/pptx-core can be used without React:
Core (@diceui/pptx-core) unzips the PPTX, parses OOXML, resolves the slide/layout/master/theme inheritance chain, renders each slide to a plain DOM tree, applies typed edit operations, and saves the presentation.
React (@diceui/pptx) wraps the core with a store (based on useSyncExternalStore) and a set of primitive components. The store manages loading state, navigation, zoom, edit history, and per-slide render revisions. Components subscribe to the store and re-render only when their slice of state changes.