MediaObject.jsx

'use strict';

var React = require('react/addons');

function generateClasses(options) {
  return 'TODO: string'
}

var MediaImage = React.createClass({
  render() {
    var {mediaSpacing, alignment, href} = this.props;
    var alignmentClasses = alignment.split(' ').map(n => `media-${n}`)
    var img = <img className="media-object" {...props} />
    if (href) {
      return (
        <a className={mediaClasses} href={href}>{img}</a>
      );
    }
    return img;
  }
});

var MediaObject = React.createClass({
  var classes = generateClasses({
    base: 'media',
    modifier: this.props.stackSize.substr(0, 2),
    syntax: 'smacss',
  });

  render() {
    return (
      <div {...this.props} className={classes}>
      </div>
    );
  }
});

var MediaObject = React.createClass({
  render() {
    // TODO: validate this.props.children;
    return (
      <div className="media">
        {this.props.children}
      </div>
    )
  }
});

var MediaObject = React.createClass({
  var classes = generateClasses({
    base: 'media',
    modifier: this.props.stackSize.substr(0, 2),
    syntax: 'smacss',
  });

  render() {
    return (
      <div {...this.props} className={classes}>
      </div>
    );
  }
});


var MediaConsumer = React.createClass({
  return (
    <MediaObject>
      <MediaImage
        src="http://placehold.it/50x50"
        alignment="middle left"
        href="http://google.com" />
      {this.props.children}
      <MediaImage
        src="http://placehold.it/50x50" />
    </MediaObject>
  );
});

A reply to https://gist.github.com/stubbornella/e97662e4a197eb9a534a