https://github.com/reggarantai/rr-multi-select
A Simple multiple select React component with type to search feature that can handle thousands of data (up to 5000) with minimum latency
https://github.com/reggarantai/rr-multi-select
react react-select-multi react-select-search react-selection-library
Last synced: 6 months ago
JSON representation
A Simple multiple select React component with type to search feature that can handle thousands of data (up to 5000) with minimum latency
- Host: GitHub
- URL: https://github.com/reggarantai/rr-multi-select
- Owner: reggarantai
- Created: 2022-05-07T12:28:51.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-05-07T12:50:26.000Z (over 3 years ago)
- Last Synced: 2025-07-12T11:51:11.578Z (7 months ago)
- Topics: react, react-select-multi, react-select-search, react-selection-library
- Language: JavaScript
- Homepage:
- Size: 6.55 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Multiple Select React Component
Multiple select React component with "type to search" feature.
It can handle thousands of data (up to 5000 records) synchronously with minimum latency.
There are cool & amazing packages out there,
but I found it laggy when handling thousands of data synchronously.
So I made this for my needs.
Hope it can be useful too for your needs.
## Install
Install using:
`yarn add rr-multi-select`
or `npm install rr-multi-select`
## Usage
##### 1. Simple array
```javascript
import React, {useState} from 'react'
import RRMultiSelect from 'rr-multi-select'
const options = [
"Data 1",
"Data 2",
"Data 3"
]
const FormBlock = () => {
const [value,setValue] = useState([])
return (
)
}
export default FormBlock
```
##### 2. Array of objects
```javascript
import React, {useState} from 'react'
import RRMultiSelect from 'rr-multi-select'
const options = [
{value:"data1",label:"Data 1"},
{value:"data2",label:"Data 2"},
{value:"data3",label:"Data 3"}
]
const FormBlock = () => {
const [value,setValue] = useState([])
return (
)
}
export default FormBlock
```
### Props
| Name | Description
| ----------- | -----------
| options | Array
| isObject | Array ie. ["value","label"]
| value | Array
| placeholderText | String ie. "Select..."
| inputPlaceholder | String ie. "Type to search..."
| onChange | Function