Bug Whisper Widget

A customizable widget for collecting bug reports and feedback from your users.

Installation

npm install @bug-whisper/widget
# or
yarn add @bug-whisper/widget

Usage

import { BugWhisperer } from '@bug-whisper/widget';
import '@bug-whisper/widget/dist/styles/bugwhisperer.css';

function App() {
  return (
    <BugWhisperer
      apiKey="your-api-key"
      theme={{
        primary: '#007bff',
        secondary: '#6c757d',
        text: '#212529'
      }}
      position="bottom-right"
      labels={{
        title: 'Report a Bug',
        submitButton: 'Send Report',
        cancelButton: 'Close'
      }}
    />
  );
}

Configuration Options

| Option | Type | Default | Description | |--------|------|---------|-------------| | apiKey | string | required | Your Bug Whisper API key | | endpoint | string | 'https://api.bugwhisperer.com' | API endpoint | | position | 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left' | 'bottom-right' | Widget position | | theme | object | see below | Theme customization | | labels | object | see below | Custom labels |

Default Theme

{
  primary: '#007bff',
  secondary: '#6c757d',
  text: '#212529'
}

Default Labels

{
  title: 'Bug Whisper',
  submitButton: 'Submit',
  cancelButton: 'Cancel'
}