A plug-and-play React library for onboarding tours and product walkthroughs — accessible by default, configured once for your whole app.
NFSFU234TourGuide is a plug-and-play React library for building onboarding tours, walkthroughs, and product-tour tooltips — with a real accessibility pass and project-wide configuration, without pulling in a heavy dependency tree.
Version 2.0.2 added a full accessibility overhaul, its first automated test suite, and shared project-wide config so an app doesn't need to repeat the same props on every tour instance.
What it does
- Step-by-step tooltips with target highlighting, progress bar, and smart positioning that auto-flips near viewport edges
- Full keyboard navigation, focus trapping, and ARIA roles
defineConfig() and <TourProvider> set tour defaults once for an entire app- Device-aware steps — show different content or skip a step entirely on mobile vs. desktop
- Optional welcome screen with scroll lock, fully customizable theming
- Zero dependencies beyond React and ReactDOM
A quick example
import { Tour } from "@nfsfu234/tour-guide";
<Tour
steps={[{ target: "#hero", content: "Welcome!" }]}
isActive={true}
/>
Real usage feedback shapes TourGuide's direction the same way it does the rest of NFORSHIFU234 Dev's open-source work — issues and PRs are genuinely welcome. MIT licensed.
