[lojack]

Your ERB function is actually wrong though....

      <div class='card'>
        <% if this_props_delta? %>
          <%= content_tag_for(:strong, :class => @delta > 0 ? 'text-success' : 'text-danger' ) do %>
            <%= @this_props_delta %>
          <% end %>
        <% end %>
        <%= @this_props_title %>
      </div>

I'm not a rails developer, so I'm only marginally certain of the correctness of this, and less certain if there's a more verbose way to write it. Likewise, I've only played around with React, so its possible that the React version can be made less verbose.

One could just as easily argue:

    <div className='card'>
      {() => { this.props.delta ? (
        <strong className={this.props.delta > 0 ? 'text-success' : 'text-danger'}>
            {this.props.delta}
          </strong>
      ) : null }() }
      {this.props.title}
    </div>

Is the same amount of typing. Honestly though, I feel as though this whole argument is a bit of an apples-to-oranges type of argument.

[kentor]

Here's how I would inline it, and I encourage people to do it this way. Intermediate variable is not necessary. Ternary is not necessary since false evaluates to null in jsx.

  render() {
   return (
     <div className='card'>
       {this.props.delta > 0 &&
         <strong className={this.props.delta > 0 ? 'text-success' : 'text-danger'}>
           {this.props.delta}
         </strong>
       }
       {this.props.title}
     </div>
   );
  }