New Package: @revealjs/react
reveal.js now has an official React wrapper! The @revealjs/react package lets you build presentations using React components—<Deck>, <Slide>, <Stack>, <Fragment>, and <Code>. Learn more over at revealjs.com/react.
import { Deck, Slide, Fragment } from '@revealjs/react';
<Deck>
<Slide>
<h1>Hello World</h1>
<Fragment asChild>
<h2>Appears on click</h2>
</Fragment>
</Slide>
</Deck>
Try it out by pulling reveal.js master and running npm run react:demo.
Breaking Changes
See the full upgrade guide for step-by-step instructions. The short version:
- Plugin paths have moved —if your presentation HTML loads plugins directly from the file system or via CDN, update your paths from
plugin/<name>/plugin.js to dist/plugin/<name>.js (e.g. plugin/notes/notes.js → dist/plugin/notes.js, plugin/highlight/monokai.css → dist/plugin/highlight/monokai.css)
- ES module paths renamed —
.esm.js files are now .mjs (e.g. dist/reveal.esm.js → dist/reveal.mjs). If you import via bare module specifiers this doesn't affect you.
- CSS paths changed — if you install via npm, the
dist/ prefix has been dropped from the public package API (e.g. reveal.js/dist/reveal.css → reveal.js/reveal.css).
- TypeScript — reveal.js now ships with types included. If you were previously using
@types/reveal.js you can remove it and migrate. Note that the type names are slightly different, more info in the upgrade guide.
Changes
- Switch from gulp to Vite for building and running reveal.js (@hakimel)
- Add official React wrapper for reveal.js — @revealjs/react (@hakimel)
- TypeScript types are now published as part of the package, based on the great work over at @types/reveal
- Dark mode and llms.txt support for revealjs.com.
- Add
controls: 'speaker' config option to show controls only in speaker view (@hakimel in #3853)
- Videos blocked from autoplaying with audio will now play muted with an unmute button, replacing the previous browser-dependent blocked state (@hakimel)
- MathJax 4 support in the math plugin (@Khlick in #3811)
- Accessibility improvements:
alt tags on images and videos are now announced by screen readers, and slide content is better punctuated for screen reader text (@hakimel in #3757, #3772)
sync() now also updates slide classes, fixing issues when adding or removing slides and then calling sync (@hakimel)- A
sync event is now dispatched when reveal.js syncs (@hakimel)
- Add
removeHiddenSlides() to the API (@hakimel)
data-id is now supported for slide links (@hakimel)data-preview-link value now takes precedence over the anchor's href (@hakimel in #3854)- Prevent iframes from stealing keyboard focus, controllable via the new
preventIframeAutoFocus config option (@hakimel)
- Pressing Enter on the active slide in overview mode now exits the overview and opens that slide (@tobi-or-not-tobi)
- The
display config option now supports !important (@boba-beba)
- Distinct active/hover state difference in overview mode (@hakimel in #3780)
Fixes
- Fix videos not autoplaying when navigating with control arrows on Android (@hakimel)
- Fix initial video autoplay not working on Android (@hakimel)
- Fix multiple videos started simultaneously sometimes failing to render in Mobile Safari (@hakimel)
- Fix overview mode missing slide thumbnails in adjacent stacks with more than 10 vertical slides (closes #3754) (@hakimel)
- Fix missing font in dracula theme (fixes #3781) (@hakimel)
- Fix SCSS deprecation warnings by refactoring all themes to latest Sass syntax (@hakimel)
Full Changelog: https://github.com/hakimel/reveal.js/compare/5.2.1...6.0.0
