Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/chrislaughlin/prop-type-utils
A collection of utility functions for react prop types
https://github.com/chrislaughlin/prop-type-utils
javascript proptypes reactjs validation
Last synced: about 1 month ago
JSON representation
A collection of utility functions for react prop types
- Host: GitHub
- URL: https://github.com/chrislaughlin/prop-type-utils
- Owner: chrislaughlin
- License: apache-2.0
- Created: 2018-03-06T20:54:32.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2019-11-21T12:24:06.000Z (almost 5 years ago)
- Last Synced: 2024-04-26T00:42:21.901Z (7 months ago)
- Topics: javascript, proptypes, reactjs, validation
- Language: JavaScript
- Size: 320 KB
- Stars: 4
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
# Prop Type Utils
[![npm package][npm-badge]][npm]
Prop Typ Utils is a collection of _useful_ prop type validation rules.
Logo designed by [Liffy Designs](http://www.liffydesigns.co.uk/)
Install
```
npm i prop-type-utils
```
Use
You can import the named utils from the main package:
```javascript
import { includes, isGreaterThan } from 'prop-type-utils';
......
static propTypes = {
age: isGreaterThan(18),
title: includes('cool')
}
```
Or you can import the individual utils as you need them
```javascript
import isBetween from 'prop-type-utils/lib/isBetween';
......
static propTypes = {
score: isBetween(10, 60)
}
```
## Utils:
- [isEven](#iseven)
- [isGreaterThan](#isgreaterthan)
- [isLessThan](#islessthan)
- [isBetween](#isbetween)
- [includes](#includes)
- [isRequiredWhen](#isrequiredwhen)
- [isRequiredWhenAll](#isrequiredwhenAll)
- [isOnlyOneAllowed](#isOnlyOneAllowed)
- Have more? Raise a PR
### isEven
```javascript
import isEven from 'prop-type-utils/isEven';
Foo.propTypes = {
bar: isEven
}
//Examples
//Error
//Success
```
### isGreaterThan
```javascript
import isGreaterThan from 'prop-type-utils/isGreaterThan';
Foo.propTypes = {
bar: isGreaterThan(5)
}
//Examples
//Error
//Success
```
### isLessThan
```javascript
import isLessThan from 'prop-type-utils/isLessThan';
Foo.propTypes = {
bar: isLessThan(5)
}
//Examples
//Error
//Success
```
### isBetween
```javascript
import isBetween from 'prop-type-utils/isBetween';
Foo.propTypes = {
bar: isBetween(5, 10)
}
//Examples
//Error
//Success
```
### includes
```javascript
import includes from 'prop-type-utils/includes';
Foo.propTypes = {
bar: includes('react')
}
//Examples
//Error
//Success
```
### isRequiredWhen
```javascript
import includes from 'prop-type-utils/isRequiredWhen';
Foo.propTypes = {
isShowing: PropTypes.bool
bar: isRequiredWhen('isShowing')
}
//Examples
//Error
//Success
```
### isRequiredWhenAll
```javascript
import isRequiredWhenAll from 'prop-type-utils/isRequiredWhenAll';
Foo.propTypes = {
isShowing: PropTypes.bool,
foo: PropTypes.string,
bar: isRequiredWhenAll(['isShowing', 'foo'])
}
//Examples
//Error
//Error
//Success
//Success
```
### isOnlyOneAllowed
```javascript
import isOnlyOneAllowed from 'prop-type-utils/isOnlyOneAllowed';
Foo.propTypes = {
isShowing: isOnlyOneAllowed(['isShowing','foo', 'bar']),
foo: isOnlyOneAllowed(['isShowing','foo', 'bar']),
bar: isOnlyOneAllowed(['isShowing','foo', 'bar'])
}
//Examples
//Error
//Error
//Success
//Success
```
[build-badge]: https://img.shields.io/travis/user/repo/master.png?style=flat-square
[build]: https://travis-ci.org/user/repo
[npm-badge]: https://img.shields.io/npm/v/npm-package.png?style=flat-square
[npm]: https://www.npmjs.org/package/npm-package