Custom React PropType validators that we use at Airbnb. Use of airbnb-js-shims or the equivalent is assumed.
and: ensure that all provided propType validators pass
childrenHavePropXorChildren: ensure that either all children have the indicated prop, all children have children, or all children have neither.
childrenOfType: restrict the prop to only allow children of the given type.
componentWithName: restrict the prop to only allow a component with a certain name/displayName.
forbidExtraProps: pass your entire
propTypesobject into this function, and any nonspecified prop will error.
mutuallyExclusiveProps: provide a propType, and a list of props, and only one prop out of the list will be permitted, validated by the given propType.
nChildren: require a specific amount of children.
nonNegativeInteger: require that the prop be a number, that is 0, or a positive integer.
or: recursively allows only the provided propTypes, or arrays of those propTypes.
range: provide a min, and a max, and the prop must be a number in the range
restrictedProp: this prop is not permitted to be anything but
uniqueArray: this prop must be an array, and all values must be unique (determined by
PropTypes.array, but with uniqueness.
uniqueArray, with a type validator applied. Like
PropTypes.arrayOf, but with uniqueness.
withShape: takes a PropType and a shape, and allows a shape to be enforced on any non-null/undefined value.
PropTypes are typically not included in production builds of React, this library’s functionality serves no useful purpose. As such, when the
NODE_ENV environment variable is
"production", instead of exporting the implementations of all these prop types, we export mock functions - in other words, something that ensures that no exceptions are thrown, but does no validation. When environment variables are inlined (via a browserify transform or webpack plugin), then tools like webpack or uglify are able to determine that only the mocks will be imported - and can avoid including the entire implementations in the final bundle that is sent to the browser. This allows for a much smaller ultimate file size, and faster in-browser performance, without sacrificing the benefits of
Simply clone the repo,
npm install, and run