React Presentable is a lightweight zero-dependency module to create slideshows inside React. The slides can render whatever react code you like.
Use the arrow keys or left mouse button to navigate between slides.
npm install --save react-presentable
import Presentation, { Slide } from 'react-presentable'
// ...
return (
<Presentation
style={{ width: '100vw', height: '100vh' }}
theme={{ backgroundColor: 'violet', textColor: '#fff' }}
>
<Slide>
<h1>Slide 1</h1>
</Slide>
<Slide>
<h1>Slide 2</h1>
</Slide>
</Presentation>
)
- optional
- type:
ReactNode
The slides in the presentation.
- optional
- type:
CSSProperties
Override styling of the presentation.
- optional
- type:
PresentationTheme
The theme of your presentation. backgroundColor?: string textColor?: string
- optional
- type:
boolean
- default:
true
Display a animated progress bar or not.
- optional
- type:
boolean
- default:
true
Display left and right arrows for changing slides.
- optional
- type:
CSSProperties
The CSS class of the presentation element