PropTypes outside of React. Independent type checks module

using react PropTypes is awesome, and can help catching errors at the early stage, but sometimes, when the application is pretty large, there is always a flow of data structures of a big size. Like in the web email client application, there can be a Message type that is passed all over the place, and multiple components can accept it in props.

so the solution to that is usually creating a type file. e.g.

// types/message.js

import React from 'react';

export default React.PropTypes.shape({
    id: React.PropTypes.string.isRequired,
    subject: React.PropTypes.string
}).isRequired;

and then reusing this type in components that get messages in props

import messageType from './types/message';

MessagePreview.PropTypes = {
  message: messageType
}

but sometimes this data flows in some other than components elements. for example flux stores, or action creators. And that usually requires duplication of types (using immutable.js records or similar)

That would we really nice if we could use this type checks in other parts of the application.

for example

// stores/message.js

import messageType from './types/message';
import checkTypes from 'react/check-types';

/**
 * @param {Array<Object>} payload.messages the array of message objects received from the API
 */
onDataReceived = (payload) => {
  payload.messages.forEach((message) => {
    checkTypes(message, messageType);
    addToStore(message);
  });
}

will this be any good? I guess architectually it means making propTypes.js more independent, and creating an adapter for prop/context validating

[ArmorDarks]

I know this is old issue, but it’s sad to see it closed. I think I’m not the only one who’d like to use PropTypes in non-React projects too.

Did anything change during last year?

[sophiebits]

FWIW we use https://github.com/reactjs/react-docgen at Facebook.

We’re not going to build this as part of React but perhaps something like Flow will have optional runtime typechecks eventually which could incorporate some or all of this functionality.