change the global variable to a new sample component

docs/docs/02.1-jsx-in-depth.md

@@ -138,7 +138,7 @@ var tree = Nav(null, React.DOM.span(null));
 If you are building a component that have a lot of childrens, or if you are building your application with some categories of reusable components (like a `Form` category), to make more simple and easiest, you can use a *namespaced component* to avoid something like this:
 
 ```javascript
-var Form = Form;
+var Form = MyFormComponent;
 var FormRow = Form.Row;
 var FormLabel = Form.Label;
 var FormInput = Form.Input;
@@ -156,7 +156,7 @@ var App = (
 Instead of declare a bunch of variables at the top, you'll get just one component that have other components as attributes.
 
 ```javascript
-var Form = Form;
+var Form = MyFormComponent;
 
 var App = (
   <Form>
@@ -171,11 +171,11 @@ var App = (
 For doing this, you just need to create your *"sub-components"* as attributes of the main component:
 
 ```javascript
-var Form = React.createClass({ ... });
+var MyFormComponent = React.createClass({ ... });
 
-Form.Row = React.createClass({ ... });
-Form.Label = React.createClass({ ... });
-Form.Input = React.createClass({ ... });
+MyFormComponent.Row = React.createClass({ ... });
+MyFormComponent.Label = React.createClass({ ... });
+MyFormComponent.Input = React.createClass({ ... });
 ```
 
 JSX will take care to make the things right when compile your code.