Does not recognize a `CallExpression`.

[ryanpcmcquen]

| Compiling...Warning: Cannot parse source\containers\ProductCard\ProductCard.js: TypeError: Got unsupported definition type. Definition must be one of ObjectExpression, ClassDeclaration, ClassExpression,VariableDeclaration, ArrowFunctionExpression, FunctionExpression, TaggedTemplateExpression or FunctionDeclaration. Got "CallExpression"instead.

It usually means that react-docgen does not understand your source code, try to file an issue here:
https://github.com/reactjs/react-docgen/issues

When using ReactRedux.connect( containers are returned as CallExpressions. Is there a workaround to make react-docgen recognize them?

[fkling]

Could you provide a complete code example and the output of running react-docgen? Which tool are you using here?

[ryanpcmcquen]

@fkling, you can do a npm install && npm run styleguide here to see the errors: https://github.com/ryanpcmcquen/ui-sources-builder-prototype

[okonet]

Same here when trying to document components written with https://github.com/jxnblk/styled-system/tree/master/system-components

import system from 'system-components'

// creates a Box with default props tied to your theme
const Box = system({
  p: 2,
  bg: 'blue'
})

[selrond]

Same issue here, using react-styleguidist with styled-system & system-components

import system from 'system-components'
import { themeGet } from 'styled-system'

const Box = system(
    {
        blacklist: ['round'],
    },
    'space',
    'width',
    'fontSize',
    'textColor',
    'bgColor',
    'color',
    // typography
    'fontFamily',
    'textAlign',
    'lineHeight',
    'fontWeight',
    'letterSpacing',
    // layout
    'display',
    'maxWidth',
    'minWidth',
    'height',
    'maxHeight',
    'minHeight',
    'size',
    'ratio',
    'border',
    'borderTop',
    'borderRight',
    'borderBottom',
    'borderLeft',
    'borders',
    'borderColor',
    // position
    'position',
    'zIndex',
    'top',
    'right',
    'bottom',
    'left',
    props => ({
        borderRadius: props.round ? `${themeGet('radii.1')(props)}px` : 0,
        boxShadow: props.shadow ? themeGet('shadows.1')(props) : 'none',
    }),
)

/** @component */
export default Box

Getting

Warning: Cannot parse src/components/atoms/Grid/Box.js: TypeError: Got unsupported definition type. Definition must be one of ObjectExpression, ClassDeclaration, ClassExpression,VariableDeclaration, ArrowFunctionExpression, FunctionExpression, TaggedTemplateExpression or FunctionDeclaration. Got "CallExpression"instead.

It usually means that react-docgen does not understand your source code, try to file an issue here:
https://github.com/reactjs/react-docgen/issues

[flybayer]

Has anyone found a solution to this (using system-components with react-styleguidist)?

[sapegin]

Looks like with system-components 3.x the error is a bit different:

TypeError: Got unsupported definition type. Definition must be one of ObjectExpression, ClassDeclaration, ClassExpression,VariableDeclaration, ArrowFunctionExpression, FunctionExpression, TaggedTemplateExpression or FunctionDeclaration. Got "Literal"instead.

Literal instead of CallExpression.

[sapegin]

Nope, it's not because of system-components 3.x, it's because https://github.com/Jmeyering/react-docgen-annotation-resolver/pull/3

[jamesmfriedman]

I need the exact same thing, but for me it's my own personally defined factory functions.

/**
 * The Elevation Component
 */
export const Elevation: React.ComponentType<ElevationPropsT> = simpleTag({
  displayName: 'Elevation',
  defaultProps: {
    z: 0
  },
  tag: 'div',
  classNames: (props: ElevationPropsT) => [
    `mdc-elevation--z${props.z}`,
    { 'mdc-elevation-transition': props.transition }
  ],
  consumeProps: ['z', 'transition']
});

export default Elevation;

Basically I need this to resolve my cast expression React.ComponentType<ElevationPropsT> with Flow.