upinser

Upinser is an npm package designed to help you easily collect user feedback through a beautiful widget for your website. Add a feedback button to your page and let your visitors rate your service and leave comments.

Visit our official documentation for detailed API documentation.

Features

• Customizable Feedback Widget: Easily integrate a feedback widget into your website with customizable text, colors, and themes (light/dark).
• Emoji & Text-Based Feedback: Allow visitors to express their experience with emojis and detailed text feedback for better insights.
• Advanced Analytics Dashboard: Track feedback data such as ratings, comments, browser type, OS, submission date, and referral URL with real-time charts.
• API Key Authentication: Secure your data with unique API keys generated for each project, ensuring safe feedback management.
• Easy Integration with React/Next.js: Install the Upinser npm package and add the widget to your project in just a few lines of code.

Installation

To install Upinser, use the following command:

npm install upinser

Usage

To start using Upinser in your project, initialize the client by providing your API key:

import UpinserStar from "upinser";

// Initialize Upinser Widget
export default function Home() {
    return (
        <div>
            <UpinserStar/>
        </div>
    )
}

Options (Props)

Below is a detailed table of props supported by the component, including their types, default values, and descriptions to help you integrate it seamlessly.

| Prop | Data type | Default value | Description | |--------------|----------------|----------------|---------------------------------------| | buttonWithText | boolean | false | If true, the button displays "Use Feedback", otherwise, it shows only an icon. | | theme | "string" | dark | Determines the appearance of the feedback widget. Accepted values: "dark" and "light". | | headingTitle | string | "What’s your experience with us?" | The main heading of the feedback popup. | | subHeading | string | "Rate this site with an emoji, share your thoughts, and help us improve!" | The subheading text that explains how the feedback system works. | | textareaPlaceholder | string | "Share your thoughts to help us improve!" | Placeholder text for the feedback input field. | | submitButtonText | string | "Submit feedback" | Text displayed on the submit button. | | thankYouTitle | string | "Thanks for feedback!" | Title shown after feedback is successfully submitted. | | closeButtonText | string | "Close" | Text displayed on the close button. | | errorNotificationMessage | string | "Please select an emoji and enter your feedback." | DError message shown if feedback submission is incomplete. | | errorNotificationDescription | string | "Your message must be at least 10 characters long." | Additional error message explaining the minimum text length requirement. |

Contributing

Contributions to Upinser are always welcome! If you have ideas for improvements, found a bug, or want to contribute new features, please review our contribution guidelines and code of conduct before opening an issue or submitting a pull request.