Angular2-Feedback

Angular2-feedback is an Angular library for collecting users feedbacks with ability to create page element screenshot. The user will be able to set rate experience, add feedback, select an element of the page to create a screenshot and leave users email

Setup

Install library

npm install --save angular2-feedback

Add Angular2FeedbackModule in to your feature module.

import { Angular2FeedbackModule } from 'angular2-feedback';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    Angular2FeedbackModule
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

Add the Angular2FeedbackComponent in to your AppComponent.

...
template: '<angular2-feedback></angular2-feedback>'
...

The options and events that can be used when working with feedback widget.

<angular2-feedback 
    [feedbackEmojiNames]="emojis"
    [feedbackWidgetOptions]="options"
    (feedbackStart)="onStart()"
    (feedbackDialogClosed)="onClose()"
    (feedbackOutput)="onOutput($event)"
  ></angular2-feedback>

Options

Feedback widget options

Option | Type | Default ------------- | ------------- | ------------- feedbackEmojiNames | Array<string>(5) | ['very bad', 'dislike', 'neutral', 'like', 'very good'] feedbackWidgetOptions | FeedbackWidgetOptions | { buttonText: 'Feedback', buttonClass: 'feedback-btn__start', buttonSize: 'medium', feedbackPosition: 'right', feedbackSuccessTitle: FEEDBACK_SUCCESS_TITLE, feedbackRateTitle: FEEDBACK_RATE_TITLE, feedbackEmailTitle: FEEDBACK_EMAIL_TITLE, feedbackPlaceholder: FEEDBACK_PLACEHOLDER }

 interface FeedbackWidgetOptions {
   buttonSize?: 'small' | 'middle' | 'large';
   feedbackPosition?: 'right' | 'left';
   buttonClass?: string;
   buttonText?: string;
   feedbackSuccessTitle?: string;
   feedbackRateTitle?: string;
   feedbackEmailTitle?: string;
   feedbackPlaceholder?: string;
 }

Output

 
 interface FeedbackWidgetOutput {
   email: string;
   score: number; // 1 - 5
   screenshot: null | File;
   feedback: string;
   route: null | url;
 }

License

MIT © Ochreretnyi Oleksandr