react-styleguidist
react-styleguidist copied to clipboard
styleguidist
@component comment + Flow types give "unknown" property type
Current behavior
If you define a component using Emotion (or any styled components lib I guess) like the following:
// @flow
import React from 'react';
import styled from '@emotion/styled';
type Props = {
color: string,
};
const Button = styled(({ color, ...props }: Props) => <button {...props} />)`
color: ${props => props.color};
`;
Button.defaultProps = {
color: 'red',
};
// @component
export default Button;
The generated "props & methods" list will mark all the property types as "unknown":
To reproduce
https://github.com/FezVrasta/styleguidist-emotion-bug-repro/
Expected behavior
The Type should return a correct type, the same that happens if you do this:
// @flow
import React from 'react';
import styled from '@emotion/styled';
type Props = {
color: string,
};
const Button = (props: Props) => <div />;
// @component
export default Button;
đ´ This issue has been automatically marked as stale because it has not had recent activity. It will be closed in a week without any further activity. Consider opening a pull request if you still have this issue or want this feature.
![stale[bot] avatar](https://avatars.githubusercontent.com/in/1724?v=4 "Published by a pub.dev verified publisher"){kind=small}
đ´ This issue has been automatically marked as stale because it has not had recent activity. It will be closed in a week without any further activity. Consider opening a pull request if you still have this issue or want this feature.
Hi, @FezVrasta I made it working by making another component and wrapping the styled-components around my original component. `// @flow import React from 'react'; import styled from '@emotion/styled';
type Props = { color: string, };
const StyledButton= styled(({color, ...props}: Props) => color: ${props => props.color};)
const Button = ()=> <StyledButton></StyledButton>
Button.defaultProps = { color: 'red', };
// @component export default Button;`
Thank you but that's not a viable solution, it's merely a workaround âšī¸
đ´ This issue has been automatically marked as stale because it has not had recent activity. It will be closed in a week without any further activity. Consider opening a pull request if you still have this issue or want this feature.
đ´ This issue has been automatically marked as stale because it has not had recent activity. It will be closed in a week without any further activity. Consider opening a pull request if you still have this issue or want this feature.
đ´ This issue has been automatically marked as stale because it has not had recent activity. It will be closed in a week without any further activity. Consider opening a pull request if you still have this issue or want this feature.
đ´ This issue has been automatically marked as stale because it has not had recent activity. It will be closed in a week without any further activity. Consider opening a pull request if you still have this issue or want this feature.
đ´ This issue has been automatically marked as stale because it has not had recent activity. It will be closed in a week without any further activity. Consider opening a pull request if you still have this issue or want this feature.
đ´ This issue has been automatically marked as stale because it has not had recent activity. It will be closed in a week without any further activity. Consider opening a pull request if you still have this issue or want this feature.
đ´ This issue has been automatically marked as stale because it has not had recent activity. It will be closed in a week without any further activity. Consider opening a pull request if you still have this issue or want this feature.
đ´ This issue has been automatically marked as stale because it has not had recent activity. It will be closed in a week without any further activity. Consider opening a pull request if you still have this issue or want this feature.
đ´ This issue has been automatically marked as stale because it has not had recent activity. It will be closed in a week without any further activity. Consider opening a pull request if you still have this issue or want this feature.