react-docgen
react-docgen copied to clipboard
Entire import statement taken as the type of imported constant
This issue appears to be the same as https://github.com/reactjs/react-docgen/issues/150, however, now instead of it throwing an error, the entire import statement is presented as the type.
In my use case, a particular prop can only be one of a few strings which are constants defined in another file. When importing them directly, the json output copies the entire import statement, rather than just the constant value or name, for example:
import { const1, const2, const3, const4 } from './otherFile';
//...
Comp.propTypes = {
prop: PropTypes.oneOf([const1, const2])
}
Which produces:
// ...
{
"value": "import { const1, const2, const3, const4 } from './otherFile';",
"computed": "true"
},
{
"value": "import { const1, const2, const3, const4 } from './otherFile';",
"computed": "true"
},
// ...
The work around for this is to import everything under an alias first, as mentioned in issue #150 (import * as constantsAlias from './otherFile';), which works, but it is preferable not to need a workaround and the previous issue was closed.
The situation can be replicated in the playground, where the imported constants are represented by imports from 'react':
import React, { Component, PureComponent, useEffect, useState } from 'react';
import PropTypes from 'prop-types';
class MyComponent extends Component {
render() {
// ...
}
}
MyComponent.propTypes = {
foo: PropTypes.oneOf([
Component,
PureComponent,
React.Component,
React.PureComponent
]).isRequired,
};
export default MyComponent;
Which produces:
{
"description": "",
"displayName": "MyComponent",
"methods": [],
"props": {
"foo": {
"type": {
"name": "enum",
"value": [
{
"value": "import React, { Component, PureComponent, useEffect, useState } from 'react';", // bug
"computed": true
},
{
"value": "import React, { Component, PureComponent, useEffect, useState } from 'react';", // bug
"computed": true
},
{
"value": "React.Component",
"computed": true
},
{
"value": "React.PureComponent",
"computed": true
}
]
},
"required": true,
"description": ""
}
}
}
Thanks for reporting. This is definitely wrong, we will have a look soon.
Indeed, I've just noticed probably the same issue:
orientation: PropTypes.oneOf([HORIZONTAL, VERTICAL]),
would produce literally those consts as strings in Storybook Docs as options, instead of the values they represent.
The reported issue is now fixed in the main branch.
@whitezo Do you have a complete example? Especially where the constants are defined. If react-docgen cannot resolve the constants then it will just user their names.