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.jstodist/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.jsfiles 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.jsyou 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:
alttags 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
syncevent is now dispatched when reveal.js syncs (@hakimel) - Add
removeHiddenSlides()to the API (@hakimel) data-idis now supported for slide links (@hakimel)data-preview-linkvalue now takes precedence over the anchor'shref(@hakimel in #3854)- Prevent iframes from stealing keyboard focus, controllable via the new
preventIframeAutoFocusconfig option (@hakimel) - Pressing Enter on the active slide in overview mode now exits the overview and opens that slide (@tobi-or-not-tobi)
- The
displayconfig 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: 5.2.1...6.0.0