🍊 react-fav

A cute, animated favorite button for React apps.

Add a fun, GSAP-powered favorite (like/heart) button to your blog, portfolio, or product with a single import. Supports persistent counts via optional backend API.

✨ Features

• 🍊 Animated SVG orange button
• ⚡ Smooth GSAP animations
• 🔢 Shows favorite count (with optional backend)
• 🪶 Lightweight and tree-shakable
• 🛠️ Zero-config, works out of the box
• 🖥️ SSR/Next.js/Vercel-friendly
• 🟦 TypeScript support

📦 Installation

npm install react-fav
# or
pnpm add react-fav
# or
yarn add react-fav

🚀 Usage

import { Orange } from "react-fav";
import "react-fav/dist/Orange.css";

export default function App() {
  return <Orange />;
}

⚙️ How It Works

• Click the orange to "favorite".
• The orange animates and fills up as you click.
• Favorite count is fetched from /api/favorites/[domain] (see below).
• No props required. Just drop in <Orange />.

📄 License

MIT License © 2025 Dzung Vu

🙏 Credits

• GSAP for animation
• Upstash Redis for backend example