Skip to content

Commit db72690

Browse files
committed
docs: Update readme
1 parent 0f6ed03 commit db72690

File tree

1 file changed

+8
-7
lines changed

1 file changed

+8
-7
lines changed

README.md

+8-7
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@
2525
<img height="400px" src="https://github.com/user-attachments/assets/e73e8f0c-5eff-44e6-a48b-e917ed0f7b4f" />
2626
</p>
2727

28-
**Input Validator** is a plugin that adds user input validation to the [**React ChatBotify Core Library**](https://react-chatbotify.com). By default, the core library does not ship with user input validation. This plugin relies on chatbot events to intercept & validate messages, as well as chatbot hooks to provide visual feedback to users. The demo gif above should give you a pretty good idea of what this plugin is capable of doing.
28+
**Input Validator** is a plugin that adds user input validation to the [**React ChatBotify Core Library**](https://react-chatbotify.com). By default, the core library does not ship with user input validation. This plugin relies on chatbot events to intercept & validate user inputs, as well as chatbot hooks to provide visual feedback to users. The demo gif above should give you a pretty good idea of what this plugin is capable of doing.
2929

3030
For support, join the plugin community on [**Discord**](https://discord.gg/J6pA4v3AMW) to connect with other developers and get help.
3131

@@ -55,7 +55,7 @@ The plugin is incredibly straightforward to use and is [**available on npm**](ht
5555
};
5656
```
5757

58-
4. Add the `validateInput` attribute to the [**Block**](https://react-chatbotify.com/docs/concepts/conversations#block) that requires validation:
58+
4. Add the `validateTextInput` and/or `validateFileInput` attribute to the [**Block**](https://react-chatbotify.com/docs/concepts/conversations#block) that requires validation:
5959
```javascript
6060
import ChatBot from "react-chatbotify";
6161
import InputValidator, { InputValidatorBlock } from "@rcb-plugins/input-validator";
@@ -64,7 +64,7 @@ The plugin is incredibly straightforward to use and is [**available on npm**](ht
6464
const flow = {
6565
start: {
6666
message: "What is your age?"
67-
validateInput: (userInput) => {
67+
validateTextInput: (userInput) => {
6868
if (isNaN(userInput)) {
6969
return {success: false, promptContent: "Age must be a number!", promptDuration: 3000}
7070
}
@@ -83,7 +83,8 @@ The quickstart above shows how input validation can be done for **age input (e.g
8383
### Features
8484

8585
**Input Validator** is a lightweight plugin that provides the following features to your chatbot:
86-
- Validate user input submissions
86+
- Validate user text input submissions
87+
- Validate user file input (upload) submissions
8788
- Notify users with toasts/highlights upon successful/failed validations
8889
- Advanced styling options upon successful/failed validations
8990
- Auto setups with necessary events enabled out-of-the-box (plug & play!)
@@ -143,7 +144,7 @@ As you may be able to tell from above, there are 5 configurable sections within
143144

144145
#### Validating User Input
145146

146-
To validate user input, add the `validateInput` attribute to any Block that requires validation. The `validateInput` attribute is a function that receives the user's input and returns an object indicating the validation result. An example can be seen below:
147+
The plugin allows validating user text input and file input (upload). To do so, you may add the respective `validateTextInput` and `validateFileInput` attributes to any Block that requires validation. The `validateTextInput` attribute is a function that receives the user's input (string) and returns an object indicating the validation result. The `validateFileInput` attribute is a function that receives the user's uploaded files (FileList) and similarly returns an object indicating the validation result. An example can be seen below:
147148

148149
```javascript
149150
import ChatBot from "react-chatbotify";
@@ -175,7 +176,7 @@ const MyComponent = () => {
175176
}
176177
```
177178

178-
As you can see from the example above, `validateInput` takes in a `userInput` parameter and returns an object representing the validation result. The validation result contains a total of 5 properties described in the table below:
179+
As you can see from the example above, `validateTextInput` takes in a `userInput` (string) parameter and returns an object representing the validation result. The validation result contains a total of 5 properties described in the table below:
179180

180181
| Property | Type | Default Value | Description |
181182
|---------------------|----------|----------|---------------------------------------------------------------------------------------------------------------------------------------------|
@@ -185,7 +186,7 @@ As you can see from the example above, `validateInput` takes in a `userInput` pa
185186
| `promptType` | string | "info" | Defines the type of prompt to display (e.g., "error", "warning", etc.), which influences styling and colors set in plugin configurations. |
186187
| `highlightTextArea` | boolean | true | If set to `true`, highlights the input text area according to validation result, providing more visual feedback. |
187188

188-
Note that all above properties have default values assigned to them. This means that if the `validateInput` attribute does not return an expected object, validation fails by default since `success` would be `false`.
189+
Note that all above properties have default values assigned to them. This means that if the `validateTextInput` attribute does not return an expected object, validation fails by default since `success` would be `false`.
189190

190191
### Team
191192

0 commit comments

Comments
 (0)