If you are coming from V1 make sure to follow this guide to upgrade your setup.


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


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)


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.
Last modified 9mo ago