Prop Type Utils

Prop Typ Utils is a collection of useful prop type validation rules.

Logo designed by Liffy Designs

Install

npm i prop-type-utils

Use

You can import the named utils from the main package:

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

import isBetween from 'prop-type-utils/lib/isBetween';

......

static propTypes = {
    score: isBetween(10, 60)
}

Utils:

• isEven
• isGreaterThan
• isLessThan
• isBetween
• includes
• isRequiredWhen
• isRequiredWhenAll
• isOnlyOneAllowed
• Have more? Raise a PR

isEven

import isEven from 'prop-type-utils/isEven';

Foo.propTypes = {
    bar: isEven
}

//Examples
<Foo bar={1} />
//Error

<Foo bar={2} />
//Success

isGreaterThan

import isGreaterThan from 'prop-type-utils/isGreaterThan';

Foo.propTypes = {
    bar: isGreaterThan(5)
}

//Examples
<Foo bar={1} />
//Error

<Foo bar={6} />
//Success

isLessThan

import isLessThan from 'prop-type-utils/isLessThan';

Foo.propTypes = {
    bar: isLessThan(5)
}

//Examples
<Foo bar={6} />
//Error

<Foo bar={1} />
//Success

isBetween

import isBetween from 'prop-type-utils/isBetween';

Foo.propTypes = {
    bar: isBetween(5, 10)
}

//Examples
<Foo bar={1} />
//Error

<Foo bar={6} />
//Success

includes

import includes from 'prop-type-utils/includes';

Foo.propTypes = {
    bar: includes('react')
}

//Examples
<Foo bar="facebook" />
//Error

<Foo bar="react-dom" />
//Success

isRequiredWhen

import includes from 'prop-type-utils/isRequiredWhen';

Foo.propTypes = {
    isShowing: PropTypes.bool
    bar: isRequiredWhen('isShowing')
}

//Examples
<Foo isShowing={true} bar={null} />
//Error

<Foo isShowing={false} bar={null} />
//Success

isRequiredWhenAll

import isRequiredWhenAll from 'prop-type-utils/isRequiredWhenAll';

Foo.propTypes = {
    isShowing: PropTypes.bool,
    foo: PropTypes.string,
    bar: isRequiredWhenAll(['isShowing', 'foo'])
}

//Examples
<Foo isShowing={true} foo={true} bar={null} />
//Error

<Foo isShowing={true} foo={false} bar={null} />
//Error

<Foo isShowing={false} bar={null} />
//Success

<Foo isShowing={true} foo={true} bar={true} />
//Success

isOnlyOneAllowed

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
<Foo isShowing={true} foo={true} bar={null} />
//Error

<Foo isShowing={true} foo={true} bar={true} />
//Error

<Foo isShowing={false} bar={null} />
//Success

<Foo isShowing={true} foo={null} bar={null} />
//Success