FeedbackLab React

Turn User Voice into Digital Assets.

FeedbackLab is a premium, mobile-first feedback management component for React. It provides a complete, beautiful interface for collecting user feedback, voting on features, and managing bug reports—all with zero configuration.

Features

• 🎨 Premium Design: Built-in Glassmorphism, smooth animations, and refined typography.
• 📱 Mobile First: Fully responsive, full-page mobile experience with touch-optimized targets.
• 🌑 Dark & Light Modes: Automatic theming with OKLCH-based color palettes.
• ⚡ Zero Config: No external CSS dependencies (Tailwind is not required). Styles are injected automatically.
• 🗳️ Interactive: Upvote features, report bugs, and view status updates.
• 💰 Bounty System: Visual indicators for funded features (WLD/Crypto bounties).

Installation

npm install @feedbacklab/react
# or
yarn add @feedbacklab/react
# or
pnpm add @feedbacklab/react

Usage

Simply import the FeedbackLab component and drop it into your page. It is designed to take over the full viewport or container.

import { FeedbackLab } from '@feedbacklab/react';

export default function FeedbackPage() {
  return (
    <FeedbackLab 
      apiKey="fl_live_..." 
      theme="dark" // 'dark' | 'light'
    />
  );
}

Props

| Prop | Type | Default | Description | |------|------|---------|-------------| | apiKey | string | Required | Your FeedbackLab project API key. | | theme | 'dark' \| 'light' | 'dark' | Visual theme of the component. | | className | string | '' | Optional class name for the root wrapper. |

Customization

The component uses injected CSS variables for styling. You can override these variables in your global CSS if needed, though the default premium theme is designed to work out of the box.

:root {
  /* Example override */
  --fl-primary: #8b5cf6; /* Change brand color to purple */
}

License

MIT © FeedbackLab