enhance.coffee

React = require("react")
classnames = require("classnames")

ReadOnly = (CompositeComponent) -> class extends React.Component
  
  render: ->
    <CompositeComponent
      {...@props}
      className={classnames("read-only": @props.read)}
      readOnly={@props.read}
    />
    
    
FormItem = ReadOnly(require("form-item"))

enhance.js

let ReadOnly = CompositeComponent => class extends React.Component {
    
    render() {
        return <CompositeComponent {...this.props} readOnly={this.state.read}/>
    }
}
    
class FormItem extends React.Component {
    render() {
        return <input readOnly={this.props.readOnly}/>
    }
}

let Enhanced = ReadOnly(FormItem);

React.render(<Enhanced readOnly={false}/>, document.getElementById("app"));