react-enjoyhint

A lightweight React wrapper for EnjoyHint, a user onboarding and feature tour library. This package allows you to easily add step-by-step guided tours to your React applications.

✨ Features

• Plug-and-play React component
• Supports step-based onboarding and tutorials
• Uses EnjoyHint under the hood
• Automatically loads EnjoyHint CSS and JS from CDN

📦 Installation

npm install react-enjoyhint


Example Code
import React from 'react';
import EnjoyHintTour from 'react-enjoyhint';

const App = () => {
  const steps = [
    {
      selector: "#name",
      event_type: "next",
      description: "Enter your name here",
    },
    {
      selector: "#submit",
      event_type: "next",
      description: "Click to submit the form",
    },
  ];

  return (
    <div>
      <input id="name" placeholder="Your name" />
      <button id="submit">Submit</button>

      {/* EnjoyHint Tour */}
      <EnjoyHintTour steps={steps} />
    </div>
  );
};

export default App;