SerVoice React Feedback Widget

A react wrapper for the SerVoice feedback widget. Easily collect and organize feedback from your visitors and users.

Need an account? Sign up here.

Installation

npm

npm i react-feedback-widget

Usage

Import the component:

import { ServoiceFeedback } from 'react-feedback-widget';

Set your config:

const config = {
  servId: '1111111',
  servPID: 'kjh34kl2jh4kj234',
  userEmail: '[email protected]',
  userFirstName: 'David',
  userLastName: 'Groechel',
};

| Key | Value | Type | Required | | ------------- | -------------------------------------- | ------ | -------- | | servId | Your SerVoice portal Id | String | Yes | | servPID | The SerVoice project Id | String | Yes | | userEmail | The identified user in your app | String | Optional | | userFirstName | The first name of the identitfied user | String | Optional | | userLastName | The last name of the identified user | String | Optional |

Wrap your component

<ServoiceFeedback config={config}>
  <button type="button">Feedback?</button>
</ServoiceFeedback>

Note: There can only be one child element and it must emit a click event

Full Example

import { ServoiceFeedback } from 'react-feedback-widget';

function App() {
  const config = {
    servId: '1111111',
    servPID: 'kjh34kl2jh4kj234',
    userEmail: '[email protected]',
    userFirstName: 'David',
    userLastName: 'Groechel',
  };
  return (
    <div className="App">
      <ServoiceFeedback config={config}>
        <button type="button">Feedback</button>
      </ServoiceFeedback>
    </div>
  );
}

export default App;

Code Sandbox Example

About

This project is maintained by David Groechel and SerVoice.