coffee-react-transform
coffee-react-transform copied to clipboard
Spread attributes break when used w/ function called with more than 1 arg
Example: http://jsdf.github.io/coffee-react-transform/?code=IyBAY2pzeCBSZWFjdC5ET00KCkNhciA9IFJlYWN0LmNyZWF0ZUNsYXNzCiAgcmVuZGVyOiAtPiAoCiAgCTxkaXYgYT1iIHsuLi5wYW5lUHJvcHMoYSwgYil9PkRhc2hib2FyZDwvZGl2PgoJKQ%3D%3D
Remove the , b
and the right side becomes valid coffeescript.
At the moment I've only tried to support simple variable and property accesses in the spread operator, so you would have to do eg.
React.createClass
render: ->
props = paneProps(a, b)
<div a="b" {...props}>Dashboard</div>
When I get time I'll add support for arbitrary expressions inside the spread operator but it's not the top priority right now.
Want to add a +1 to this. I'm using a function {...@style('first', 'second')}
as a regular pattern and this is causing a lot of inelegant code (especially with larger JSX expressions).
Right now I have to write code like this:
render: ->
<div {...@styled('example', @props.selected && 'example_selected')} >
Must be written as:
render: ->
exampleStyles = @styled('example', @props.selected && 'example_selected')
<div {...exampleStyles} >
This can often balloon to the point where every render function has a bunch of variable assignments like this.
I played around and it seems like you can compile almost anything if you remove all of the spaces.
@nemothekid, you can remove the ,
and it'll compile correctly.
Car = React.createClass
render: ->
<div a=b {...paneProps(a,b)}>Dashboard</div>
http://jsdf.github.io/coffee-react-transform/?code=IyBAY2pzeCBSZWFjdC5ET00KCkNhciA9IFJlYWN0LmNyZWF0ZUNsYXNzCiAgcmVuZGVyOiAtPiAoCiAgCTxkaXYgYT1iIHsuLi5wYW5lUHJvcHMoYSxiKX0%2BRGFzaGJvYXJkPC9kaXY%2BCgkp
@kballenegger
render: ->
<div {...@styled('example',@props.selected&&'example_selected')} >
http://jsdf.github.io/coffee-react-transform/?code=cmVuZGVyOiAtPgogIDxkaXYgey4uLkBzdHlsZWQoJ2V4YW1wbGUnLEBwcm9wcy5zZWxlY3RlZCYmJ2V4YW1wbGVfc2VsZWN0ZWQnKX0vPgo%3D
Object
render: ->
<div {...@fizz(foo:false,bar:false,fooBar:true)} />
http://jsdf.github.io/coffee-react-transform/?code=IyBAY2pzeCBSZWFjdC5ET00KCnJlbmRlcjogLT4KICA8ZGl2IHsuLi5AZml6eihmb286ZmFsc2UsYmFyOmZhbHNlLGZvb0Jhcjp0cnVlKX0gLz4%3D