pnpm add @tour-kit/react

'use client';

import { Tour, TourStep, useTour } from '@tour-kit/react';

export default function Page() {
  const { start } = useTour('welcome');

  return (
    <Tour id="welcome">
      <TourStep
        target="#hero"
        title="Welcome!"
        content="This is your first tour step."
        placement="bottom"
      />
      <TourStep
        target="#features"
        title="Features"
        content="Explore our features here."
        placement="right"
      />

      <main>
        <button onClick={() => start()}>Start Tour</button>
        <section id="hero">Hero Section</section>
        <section id="features">Features</section>
      </main>
    </Tour>
  );
}

pnpm dev