React Joyride
Overview
Search…
Overview
Props
Step
Styling
Custom Components
Callback
Constants
Accessibility
Migration
Powered By GitBook
Migration
If you are coming from V1 make sure to follow this guide to upgrade your setup.

Styling

V2 uses inline styles instead of SCSS/CSS so you need to remove the imports. Check Styling for more information.

Props

Renamed (breaking)

allowClicksThruHole ▶︎ spotlightClicks
disableOverlay false ▶︎ disableOverlayClicks false
keyboardNavigation true ▶︎ disableCloseOnEsc false the space, return and tab keys are now controlled with tabIndex
scrollToSteps true ▶︎ disableScrolling false
showBackButton true ▶︎ hideBackButton false
showOverlay true ▶︎ disableOverlay false
showStepsProgress false ▶︎ showProgress false
tooltipOffset 30 ▶︎ Use the step floaterProps.offset
type 'single' ▶︎ continuous false

Removed (breaking)

autoStart (use the disableBeacon prop on the first step)
offsetParent
resizeDebounce
resizeDebounceDelay

Step

There are a few changes to the step syntax too:
selector ▶︎ target Now it supports HTMLElement and string.
position ▶︎ placement The default is bottom now
text ▶︎ content
type ▶︎ event
allowClicksThruHole ▶︎ spotlightClicks
style ▶︎ styles The properties have changed. Be sure to update to the new syntax.
Previous
Accessibility
Last modified 11mo ago
Copy link
On this page
Styling
Props
Renamed (breaking)
Removed (breaking)
Step