Registry / web-framework / react-prop-types

react-prop-types

library0.4.0jsnpmunverified

The `react-prop-types` library provides a collection of supplementary validators for React's original `PropTypes` system. Introduced to extend the native `React.PropTypes` with utilities such as `elementType`, `all`, `componentOrElement`, `deprecated`, and `isRequiredForA11y`, it addresses common validation patterns not covered by React itself. The current stable version is 0.4.0, which reflects its development primarily during the React 0.14.x to early 15.x era. This package is specifically designed for use with older React applications where `PropTypes` were still part of the `react` package, rather than the separate `prop-types` package introduced with React 15.5.0. Its release cadence is effectively inactive, and it differentiates itself by offering specific, reusable validation functions for accessibility, deprecation warnings, and type checking for React components and DOM elements.

web-framework testing

npm install react-prop-types

github ↗package ↗

INSTALL

IMPORT

SIG · REACT-PROP-TYPES

react-prop-types

web-frameworkjavascriptv0.4.0

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

elementType

✓ import elementType from 'react-prop-types/lib/elementType';

✗ import { elementType } from 'react-prop-types';

For tree-shaking and smaller bundle sizes, direct import from the lib subdirectory is recommended. The named import from the package root also works but might pull in more code.

all

✓ import { all } from 'react-prop-types';

✗ import all from 'react-prop-types/lib/all';

While direct path imports are suggested for some validators, `all` is typically imported as a named export from the root.

deprecated

✓ import deprecated from 'react-prop-types/lib/deprecated';

✗ const deprecated = require('react-prop-types').deprecated;

This library predates widespread ESM in Node, but bundlers support `import`. For CJS, direct `require` from the specific file path is common. The `_resetWarned()` method is exposed on the default export for testing.

componentOrElement

✓ import componentOrElement from 'react-prop-types/lib/componentOrElement';

✗ import { componentOrElement } from 'react-prop-types';

Like `elementType`, direct import from the `lib` path is recommended for better optimization.

Demonstrates the setup and usage of various custom PropTypes like `elementType`, `all`, and `deprecated` within a React component.

import React from 'react'; import PropTypes from 'prop-types'; // Or `React.PropTypes` in older React versions import elementType from 'react-prop-types/lib/elementType'; import { all } from 'react-prop-types'; import deprecated from 'react-prop-types/lib/deprecated'; const MyComponent = ({ Component, optionalComponent, block, vertical, oldProp }) => ( <div> <h1>Hello from MyComponent</h1> {Component && <Component />} {optionalComponent && React.isValidElement(optionalComponent) && optionalComponent} <p>Block: {String(block)}, Vertical: {String(vertical)}</p> {oldProp && <p>Old Prop Value: {oldProp}</p>} </div> ); MyComponent.propTypes = { Component: elementType.isRequired, optionalComponent: elementType, vertical: PropTypes.bool.isRequired, block: all( PropTypes.bool.isRequired, ({ block, vertical }) => ( block && !vertical ? new Error('`block` requires `vertical` to be set to have any effect') : null ) ), oldProp: deprecated(PropTypes.string, 'Use `newProp` instead of `oldProp`.'), }; MyComponent.defaultProps = { block: false, vertical: false }; // Example usage (e.g., in an App.js): // import MyComponent from './MyComponent'; // const AnotherComponent = () => <span>I'm another component!</span>; // <MyComponent Component={AnotherComponent} vertical block oldProp="deprecated value" /> export default MyComponent;

Debug

Known issues

breakingThis library relies on the global `React.PropTypes` object, which was deprecated in React 15.5.0 and removed in React 16. It is not directly compatible with modern React applications (React 15.5.0 and newer) without a compatibility layer like `prop-types` or equivalent shims. New applications should use the official `prop-types` package and implement custom validators if needed.

fix

For new React projects (>=15.5.0), use the `prop-types` package from npm (`npm install --save prop-types`). For existing older projects, ensure React version is < 15.5.0 or use a `prop-types` shim.

affects: >=15.5.0

gotchaUsing named imports from the package root (`import { elementType } from 'react-prop-types';`) might increase bundle size compared to direct imports from the `lib` subdirectory (`import elementType from 'react-prop-types/lib/elementType';`). The library structure is optimized for direct file imports for better tree-shaking.

fix

Prefer direct imports from `react-prop-types/lib/<validatorName>` for individual validators to ensure optimal bundle size, especially in production builds.

affects: >=0.1.0

deprecatedThe `deprecated` validator within this library logs a warning to the console if a prop is used that is marked as deprecated. This is a design feature, not a problem with the validator itself, but developers should be aware that their console might show warnings for intended deprecations.

fix

When using `deprecated`, ensure that deprecated props are eventually migrated to their recommended alternatives to eliminate console warnings. For testing scenarios, `deprecated._resetWarned()` can clear the warning cache.

affects: >=0.1.0

gotchaAs an unmaintained library tied to an older React ecosystem, `react-prop-types` may not receive updates for security vulnerabilities or modern JavaScript/TypeScript compatibility. Using unmaintained dependencies can pose supply chain risks.

fix

Evaluate alternatives from maintained libraries or transition to custom validators based on the official `prop-types` package for modern React applications. Regularly audit project dependencies for known vulnerabilities.

affects: >=0.1.0

Errors

Common errors & fixes

TypeError: Cannot read properties of undefined (reading 'bool') OR TypeError: Cannot read property 'bool' of undefined

This error typically occurs when `React.PropTypes` is accessed in a React version where it has been removed (React 16+) or is expected to be imported from the `prop-types` package (React 15.5.0+). The `react-prop-types` library internally relies on `React.PropTypes`.

fix

Ensure your project uses an older React version (e.g., <15.5.0) compatible with `React.PropTypes`. For newer React versions, you must either replace `react-prop-types` with alternative validation logic or provide a global `PropTypes` object using the `prop-types` package if you are migrating an older codebase.

Module not found: Error: Can't resolve 'react-prop-types/lib/elementType' OR Cannot find module 'react-prop-types/lib/elementType'

The module path specified in the `import` or `require` statement is incorrect, or the `react-prop-types` package is not installed.

fix

Verify that `react-prop-types` is installed (`npm i react-prop-types`) and that the import path precisely matches the file structure, e.g., `import elementType from 'react-prop-types/lib/elementType';`.

Upgrade

Version history

0.4.0latest on npm

Audit

Dependencies

reactrequiredRequires the `React.PropTypes` system, which was part of the `react` package before version 15.5.0.

Agent activity

2 hits · last 30 days

node

Resources

githubhttps://github.com/react-bootstrap/react-prop-types ↗

packagehttps://www.npmjs.com/package/react-prop-types ↗