Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/laurabeatris/use-selected-items-hook
Easily select items based on an array
https://github.com/laurabeatris/use-selected-items-hook
hooks nextjs react reactjs typescript
Last synced: 3 months ago
JSON representation
Easily select items based on an array
- Host: GitHub
- URL: https://github.com/laurabeatris/use-selected-items-hook
- Owner: LauraBeatris
- License: mit
- Created: 2020-07-06T12:19:24.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2023-01-07T22:21:29.000Z (about 2 years ago)
- Last Synced: 2024-10-11T10:48:05.652Z (4 months ago)
- Topics: hooks, nextjs, react, reactjs, typescript
- Language: TypeScript
- Homepage: https://use-selected-items-hook.vercel.app
- Size: 5.83 MB
- Stars: 147
- Watchers: 2
- Forks: 11
- Open Issues: 20
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Security: SECURITY.md
Awesome Lists containing this project
README
[](https://github.com/LauraBeatris)
[](#)
[](https://github.com/LauraBeatris/use-selected-items-hook/stargazers)
[](https://github.com/LauraBeatris/use-selected-items-hook/network/members)
[](https://github.com/LauraBeatris/use-selected-items-hook/graphs/contributors)
[](https://www.npmjs.com/package/use-selected-items-hook)
---
---
# :pushpin: Table of Contents
* [Installation](#construction_worker-installation)
* [Usage](#pushpin-usage)
* [API](#computer-api)
* [Builds](#hammer-builds)
* [FAQ](#postbox-faq)
* [Found a bug? Missing a specific feature?](#bug-issues)
* [Contributing](#tada-contributing)
* [License](#closed_book-license)
# :construction_worker: Installation
### With Yarn
```bash
yarn add use-selected-items-hook
```
### With NPM
```bash
npm install use-selected-items-hook
```
# :pushpin: [Go to example](./example/pages/index.tsx)
# :computer: API
## Initialization
To initialize the `items` array, the `initialItems` must be passed as an argument. It's also possible to initialize the items already with an `isSelected` state, but to do so, it's necessary to provide the `initialSelectedItems` argument.
---
## Return Values
- ``selectedItems``: The items that are currently selected.
- ``listItems``: The items with the status of ``isSelected``. Refer to the [Usage](#pushpin-usage).
---
## Actions
- ``toggleSingleItem``
- ``toggleAllItems``
# :hammer: Builds
- `es` (EcmaScript module)
- `cjs` (CommonJS)
# :postbox: Faq
**Question:** What are the technologies used in this project?
**Answer:** The technologies and libraries used in this project are [React](https://en.reactjs.org/) + [TypeScript](https://www.typescriptlang.org/) and [Immutability Helper](https://github.com/kolodny/immutability-helper) to
handle the array manipulation.
# :bug: Issues
Feel free to **file a new issue** with a respective title and description on the the [useSelectItems hook](https://github.com/LauraBeatris/use-selected-items-hook/issues) repository. If you already found a solution to your problem, **I would love to review your pull request**! Have a look at our [contribution guidelines](https://github.com/LauraBeatris/use-selected-items-hook/blob/master/CONTRIBUTING.md) to find out about the coding standards.
# :tada: Contributing
Check out the [contributing](https://github.com/LauraBeatris/use-selected-items-hook/blob/master/CONTRIBUTING.md) page to see the best places to file issues, start discussions and begin contributing.
# :closed_book: License
Released in 2020
This project is under the [MIT license](https://github.com/LauraBeatris/use-selected-items-hook/master/LICENSE).
Made with love by [Laura Beatris](https://github.com/LauraBeatris) 💜🚀