"use strict";
var React = require("react/addons"),

    {GoogleMapsMixin, Map} = require("react-google-maps");

module.exports = React.createClass({
  /*
   * https://developers.google.com/maps/documentation/javascript/examples/map-simple
   */
  displayName: "SimpleMap",

  mixins: [require("../../ReactFutureMixin"), GoogleMapsMixin],

  _render (props, state) {
    return <div style={{height: "100%"}} {...props}>
      <Map style={{height: "100%"}} zoom={8} center={new google.maps.LatLng(-34.397, 150.644)} />
    </div>;
  }
});

@@ -106,57 +106,44 @@
 ps%22)
-;%0A%0Amodule.exports = React.createClass(%7B%0A  /*%0A   *
+,%0A%0A    SimpleMap;%0A/*%0A * Sample From:
  htt
@@ -224,41 +224,219 @@
 le%0A 
-  */%0A  displayName: %22SimpleMap%22,%0A
+*/%0ASimpleMap = React.createClass(%7B%0A  /*%0A   * 1. Create a component class that wraps all your map components in it.%0A   */%0A  displayName: %22SimpleMap%22,%0A  /*%0A   * 2. Include GoogleMapsMixin into in its mixins.%0A   */
 %0A  m
@@ -695,8 +695,425 @@
   %7D%0A%7D);%0A
+%0Amodule.exports = React.createClass(%7B%0A  /*%0A   * 3. This is your component class that renders SimpleMap.%0A   */%0A  mixins: %5Brequire(%22../../ReactFutureMixin%22)%5D,%0A%0A  _render (props, state) %7B%0A    /*%0A     * 4. The only thing you need to do is pass googleMapsApi as props.%0A     * This will be used with GoogleMapsMixin that mixes into SimpleMap%0A     */%0A    return %3CSimpleMap googleMapsApi=%7Bgoogle.maps%7D %7B...props%7D /%3E;%0A  %7D%0A%7D);%0A

add client code that renders SimpleMap