Replacing JSX with Coffeescript is really beautiful, and makes large components much more readable. I am a bit worried as it does not have much traction. JSX does not even allow to copy-paste from HTML as we need to rename all keys containing hyphens with some CamelCase.
Here is some of my Coffeescript render function, it is much more elegant than the equivalent JSX.
render: -> div className: "btn-group" role: "group" style: width: '100%'
for option in @props.options
label
key: option.value
className: @buttonClass @state.selected == option.value, option.bsColor
style:
minWidth: (100 / @props.options.length) + '%'
input
type: 'radio'
required: true
name: @props.name
value: option.value
checked: @state.selected == option.value
readOnly: false
onClick: @handleClick
"data-key": option.value
option.label