npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

sahar-chatbot

v1.2.4

Published

Enrich Conversations - Power & Flexibility at Your Fingertips!

Downloads

19

Readme

Table of Contents

Disclaimer

All the rights belong to React ChatBotify. This repository is a modified version of the original ChatBotify. The toggle button is positioned dynamically with the props given to it. For example, if you give the position prop "bottom-left", the chat toggle button will be placed at the bottom left of the page. Same goes for "bottom-right", "top-left" and "top-right"; "bottom-right" is the default positioning of the buttom mentioned.

Introduction

Chatbot is an intuitive and versatile chatbot library tailored to streamline your development process while providing the flexibility to implement advanced features. It is crafted to meet a wide range of requirements, whether you're building a straightforward FAQ chatbot or an intricate conversational interface.

Chatbot aims to simplify the creation of chatbots by offering a user-friendly experience while accommodating the diverse needs of developers. With its extensive capabilities, you can easily customize and expand your chatbot's functionalities. From basic interactions to sophisticated conversational flows, React ChatBotify empowers you to build chatbots that meet your specific project goals. Head over to our community showcases and get inspired to start your own today!

npm install sahar-chatbot --save

Note that this repository contains the code for the library. If you're looking for the repository for the React ChatBotify user guide, you may look here.

Features

Chatbot offers a wide array of features designed to enhance your chatbot experience. Here are just a few of the key features:

  • Dynamic Attributes: Create interactive conversations by dynamically generating messages and defining multiple conversation paths based on user inputs.
  • Custom Rendering of Components: Seamlessly integrate your own custom components into the chatbot interface to boast your application's unique design and functionality.
  • Timeouts and Auto-Transitions: Set timeouts and automate transitions between chatbot paths, allowing for a smooth user experience.
  • Voice Input & Audio Output: Enable voice input for users to interact with the chatbot through speech, and leverage audio output capabilities to provide spoken responses or prompts.
  • Chat Notifications: Keep users informed with real-time chat notifications, ensuring they never miss important updates or new messages.
  • Checkbox & Options Support: Utilize checkboxes and options within the chatbot interface, allowing users to select from a list of choices and easily make selections.
  • Emoji Picker: Enhance the chatbot's expression and engagement with users by incorporating emojis into messages, adding a touch of personality and emotion.
  • File Attachments: Seamlessly handle file attachments within the chatbot, enabling users to share and receive documents, images, or other relevant files during conversations.
  • Mobile-Friendly Interface: Provide smooth user experience across various devices with our mobile-friendly chatbot interface.

These features, along with many others, empower developers to create highly interactive and personalized chatbot experiences tailored to their specific application requirements.

Technologies

Technologies used by Chatbot are as below:

Done with:

Project Repository

  • https://github.com/tjtanjin/react-chatbotify

Quickstart

For a thorough walkthrough on getting started, you may refer to the Quickstart Guide on the Documentation Website.

Documentation

A full documentation (along with a live playground) for the library can be found at the following link:

  • https://react-chatbotify.tjtanjin.com/

Examples on the website are also run on a live editor so feel free to explore to your heart's content!

Contributing

If you are looking to contribute to the project, you may find the Developer Guide useful.

In general, the forking workflow is encouraged and you may open a pull request with clear descriptions on the changes and what they are intended to do (enhancement, bug fixes etc). Alternatively, you may simply raise bugs or suggestions by opening an issue or raising it up on discord.

Note: Templates have been created for pull requests and issues to guide you in the process.

Support

If there are any questions pertaining to the application itself (usage or implementation wise), you may create an issue, raise it up on discord, or drop me an email at: [email protected].

Attributions

Images

Credits are to be given for the following images:

Sound

Credits are to be given for the notification sound:

Inspirations

As I have used similar alternatives at some point in my developer journey, some inspirations have been taken from them and they ought to be credited here:

Note: All other media content are hand-drawn unless otherwise stated, feel free to use them!