🎯 feedbackfun JS

Complete customer feedback ecosystem - capture feature requests, bug reports, manage product roadmaps, and provide real-time chat support, all in one embeddable widget.

Installation

npm install @feedbackfun/js

Features

• 🚀 Feature Requests - Collect and prioritize product ideas from your users
• 🐛 Bug Reporting - Visual bug reports with automatic screenshot capture and context
• 🗺️ Product Roadmap - Interactive roadmap with voting and status tracking
• 💬 Real-time Chat Support - Instant messaging between users and your support team
• 👤 User Authentication - Associate feedback with authenticated users for better context
• 🎯 Click-anywhere Feedback - Pin feedback to any element on your website
• 🎨 Customizable Branding - Match your brand with custom colors and themes
• 🌙 Dark Mode Support - Automatic dark/light theme detection
• 📦 Zero Configuration - Widget settings managed via dashboard
• 🔒 TypeScript Support - Full TypeScript definitions included

Quick Start

1. Install the package

npm install @feedbackfun/js

2. Initialize the widget

import feedbackfun from '@feedbackfun/js';

// Initialize widget (config is fetched from your dashboard)
await feedbackfun.init({
  apiKey: 'your-api-key',
  projectId: 'your-project-id'
});

Configuration (InitConfig)

All widget configuration (colors, display mode, trigger selectors, branding, etc.) is managed via the FeedbackFun dashboard at feedbackfun.com. The init() method only requires API credentials.

| Option | Type | Required | Description | |--------|------|----------|-------------| | apiKey | string | Yes | Your FeedbackFun API key from the dashboard | | projectId | string | Yes | Your project ID from the dashboard |

Example:

await feedbackfun.init({
  apiKey: 'your-api-key',
  projectId: 'your-project-id'
});

API (FeedbackfunWidget)

| Method | Description | |--------|-------------| | init(config) | Initialize the widget with API credentials. Returns Promise<FeedbackfunWidget> | | destroy() | Cleanup and destroy the widget instance. Important for SPAs to prevent memory leaks | | getInstance() | Get the current widget instance. Returns FeedbackfunWidget \| null | | setUserInfo(user) | Set authenticated user information to associate feedback with specific users | | clearUserInfo() | Clear user information (useful for logout scenarios) | | setPrimaryColor(color) | Runtime override of the primary theme color configured in dashboard | | setPrimaryForeground(color) | Runtime override of the primary foreground color configured in dashboard |

Method Details

setUserInfo(user)

Set authenticated user information to associate feedback with specific users. You can pass any custom data fields beyond the standard ones.

Standard Parameters:

| Parameter | Type | Required | Description | |-----------|------|----------|-------------| | user.id | string | Yes | User's unique identifier | | user.name | string | No | User's display name | | user.email | string | No | User's email address |

Custom Fields:

You can pass any additional custom data as needed (e.g., avatar, role, plan, company, etc.). All custom fields will be stored and associated with the user's feedback.

Example:

feedbackfun.setUserInfo({
  id: 'user-123',
  name: 'John Doe',
  email: '[email protected]',
  // Custom fields - pass any data you want
  avatar: 'https://example.com/avatar.jpg',
  role: 'admin',
  plan: 'premium',
  company: 'Acme Inc'
});

setPrimaryColor(color)

Runtime override of the primary theme color configured in your dashboard.

Example:

feedbackfun.setPrimaryColor('#3b82f6');

setPrimaryForeground(color)

Runtime override of the primary foreground color configured in your dashboard.

Example:

feedbackfun.setPrimaryForeground('#ffffff');

License

MIT

Support

For issues, questions, or feedback, please visit feedbackfun.com and send us a message.