Unknown word about babel-plugin-styled-components-css-namespace HOT 5 CLOSED

UPDATE: found 2 bug conditions that will break the babel transformation, guaranteed. Mind you, these all compile and function properly with the regular babel plugin for styled-components. Hope these help with bug fixing! An error that states which file the CSS came from would be super helpful. Let me know if I can help with these, may try to write a pull request later.

Any sort of comment inline in the style definition where the next line starts with a nested template expression. Adding a ; after the comment works but produces stylelint errors. Ex:

const StyledComponent1 = styled.div`
  /* comment */
  ${props => 'color: blue'};
`

Any nested template literals that don't have a trailing ;, regardless of if they always return a semicolon. Ex:

const StyledComponent2 = styled.div`
	${props => 'color: blue;'}
`

from babel-plugin-styled-components-css-namespace.

The two reproducible cases @zachhardesty7 mentioned above should be fixed in this PR: #39

Once approved, I'll get a new release candidate out for further testing in the wild.

from babel-plugin-styled-components-css-namespace.

Thanks for the heads up and the possible files to repro!

from babel-plugin-styled-components-css-namespace.

Is there any update on this? Seems like a pretty big deal considering the whole thing about styled components is the ability to use javascript inline

from babel-plugin-styled-components-css-namespace.

@supadupdip - Not yet. However, the only inline js that should be affected currently are cases like those demonstrated in #33 (comment)

E.g., the following should work as expected:

const StyledComponent2 = styled.div`
	color: ${props => isSuccess  ?  'green' : 'red'};

The following fixtures are currently passing for this plugin which show using inline js: https://github.com/QuickBase/babel-plugin-styled-components-css-namespace/blob/master/src/tests/fixtures/complex_styled_component.js

The next block of time I have available to work on this plugin is 5/24 where I hope to close out many of the open issues. However, PRs are always welcome.

from babel-plugin-styled-components-css-namespace.