Docs
Reference
Handlers
propDocblock

propDocblockHandler

Tries to find the prop types on react components and extracts their Docblock description. It uses the same logic as the propTypeHandler to find the prop types.

Examples

When the propDocblockHandler is active any of these components will result in the output below

component.tsx
import PropTypes from 'prop-types';
 
class MyComponent extends React.Component {
  static propTypes = {
    /** Foo */
    foo: PropTypes.string,
    bar: PropTypes.number,
  };
  render() {
    return <div />;
  }
}
component.tsx
import PropTypes from 'prop-types';
 
class MyComponent extends React.Component {
  render() {
    return <div />;
  }
}
 
MyComponent.propTypes = {
  /** Foo */
  foo: PropTypes.string,
  bar: PropTypes.number,
};
component.tsx
import PropTypes from 'prop-types';
 
const MyComponent = () => <div />;
 
MyComponent.propTypes = {
  /** Foo */
  foo: PropTypes.string,
  bar: PropTypes.number,
};

Output

JSON
[
  {
    "props": {
      "foo": {
        "description": "Foo"
      },
      "bar": {
        "description": ""
      }
    }
  }
]
displayNamepropTypeComposition