Closed
Description
What I have
Hello, I have a functional component like this:
import styled from "styled-components";
export type ButtonProps = {
children: string;
};
export const Button = styled.button<ButtonProps>`
color: ${({ theme }) => theme.color.highlight};
padding: 1em;
`;
export default Button;
What is happening
And if I run the command zeplin connect
it fails with the following error:
Connecting components to Zeplin components failed.
Error occurred while processing components/button/index.tsx with @zeplin/cli-connect-react-plugin:
No suitable component definition found.
If i rewrite the component to an class like this:
import React from 'react';
import styled from "styled-components";
export type ButtonProps = {
children: string;
};
export const Button = styled.button<ButtonProps>`
color: ${({ theme }) => theme.color.highlight};
padding: 1em;
`;
export default class ButtonClass extends React.Component {
render(){
return Button
}
}
It works well.
What I expected
I expected I can connect functional components also with zeplin. but it looks like this is not correct.
Can someone confirm that or show me a working solution for my code?
Metadata
Metadata
Assignees
Labels
No labels