react-css-modules.macro icon indicating copy to clipboard operation
react-css-modules.macro copied to clipboard

Published 20 hours ago • verified publisher icon bohdanbirdie

Not working with extra spaces in styleName

Open gauravkumar37 opened this issue 4 years ago • 1 comments

When styleName contains extra spaces, the library doesn't work. In fact the entire output of the component disappears rather than giving a warning. Extra spaces can be present as a result of conditional styles. For example, when isLoggedIn is false, the resulting string becomes class1 (with an extra space at the end).

<div styleName={'class1 ' + (isLoggedIn ? 'green' : '')}>Hi</div>

Of course, this can very easily be worked around by moving the space from class1 to isLoggedIn.

I believe empty strings should be filtered out after splitting on space in https://github.com/bohdanbirdie/react-css-modules.macro/blob/f3a53bc40ab654ba88978c16f90e2d6b234a4189/src/macro.js#L97-L99

gauravkumar37 avatar Sep 28 '20 21:09 gauravkumar37

Hi! Yep, good catch Would you like to create a PR? I will be glad to merge it ;)

bohdanbirdie avatar Sep 29 '20 06:09 bohdanbirdie