vscode-styled-components

vscode-styled-components copied to clipboard

I'm working with Emotion and emotion react. I have styled components, that are ready to receive css style. for example,

const Button: StyledComponent<DR<IButtonProps>, {}, {}> =
	styled("button")`
		... some general button style ...
		${ ({stl}) => stl }
	`

Then parents can use them as such.

const RedBtn: DRFC<IProps> =
   ({stl, ...otherProps}) => (
		<Btn
			onMouseDown={handleClick}
			{...otherProps}
			stl={[
			css`
				background-color: red; 
                                color: white; 
                        `
			, stl,
			]}
		>
			{children}
		</Btn>)

The thing is to get the support of your extension I pass the string to the css function. This is reduntant because any way it will be passed to the css function in the styled component. Perhaps we can provide a certain signal so this extension can recognize a certain string as css.