react-native-feedback-fairy

FeedbackFairy

A User Feedback collection widget for teams to build a better product by learning what their users/customers think about their app, their feature ideas, the issues they're having and much more!

Preview

https://firebasestorage.googleapis.com/v0/b/feedbackfairy-64036.appspot.com/o/Screen%20Recording%202022-11-22%20at%2003.55.10%20(1).mp4?alt=media&token=0a0d6377-5245-4260-9452-0ae2d6700ba6

Installation

Installation is very simple and the package does not have any dependencies.

  yarn add react-native-feedback-fairy
  or
  npm install react-native-feedback-fairy

Quick Start

import FairyFeedback from 'react-native-fairy-feedback'

function App() {
  return (
    <FairyFeedback
      projectId="YOUR_PROJECT_ID"
    
    /> 
  )
  
}

API Reference

Here are the props for the Feedback component

type FeedbackProps = {

  /**
   * Your projectId on feedbackfairy.io - this field is mandatory
   * @mandatory
   **/

 🟩 projectId: string;

  /**
   * Card title
   * @default 'Whats on your mind?'
   **/
  🟩 title?: string;

  /**
   * Text shown after user has submitted feedback
   * @default 'Your response was saved. Thanks for leaving us valuable feedback!'
   **/
  🟩 completionText?: string;

  /**
   * What's the chance that the feedback card will appear 0.1 = 10%
   * @default 1
   **/
  🟩 probability?: number;

  /**
   * Warning Icon
   * @default {uri:base64}
   **/
  🟩 warningIcon?: ImageSourcePropType;

  /**
   * Idea Icon
   * @default {uri:base64}
   **/
  🟩 ideaIcon?: ImageSourcePropType;

  /**
   * Other Icon
   * @default {uri:base64}
   **/
  🟩 otherIcon?: ImageSourcePropType;

  /**
   * Check Icon that appears on completion
   * @default {uri:base64}
   **/
  🟩 checkIcon?: ImageSourcePropType;

  /**
   * Very outer container style
   **/
  🟩 containerStyle?: ViewStyle | ViewStyle[];

  /**
   * Cards that contains the icons
   **/
  🟩 cardStyle?: ViewStyle | ViewStyle[];

  /**
   * Title text style
   **/
  🟩 titleStyle?: TextStyle | TextStyle[];

  /**
   * Card title text style
   **/
  🟩 cardTitleStyle?: TextStyle | TextStyle[];

  /**
   * When a form is submitted
   * @param submittedText - Entered text
   **/
  🟩 onSubmit?: (submittedText: string) => void;

  /**
   * When a form is closed by pressing the X icon
   **/
  🟩 onClose?: () => void;

  /**
   * Input Style in the second page
   */
  🟩 inputContainerStyle?: ViewStyle;

  /**
   * Pass input props to the input on the second page
   * you cannot ovverride onChangeText
   */
  🟩 inputProps?: TextInputProps;

  🟩 submitButtonTitle?: string;
  🟩 submitButtonStyle?: ViewStyle;
  🟩 submitButtonTextStyle?: ViewStyle;

  🟩 completionTextStyle?: TextStyle | TextStyle[];

  /**
   * UserId for you to see in feedbackfairy dashboard
   */
  🟩 userId?: string;

  /**
   * User Email for you to see in feedbackfairy dashboard
   */
  🟩 userEmail?: string;

  /**
   * User Phone number for you to see in feedbackfairy dashboard
   */
  🟩 userPhoneNumber?: string;
};