finish Symbol refactor

finish Symbol refactor
finish all reusable elements refactor (iOS)

elements/Symbol.js

@@ -1,25 +1,36 @@
 import React, {Component, PropTypes} from 'react';
-
 import ViewBox from './ViewBox';
 import G from './G';
+import Defs from './Defs';
 
 class SymbolElement extends Component{
     static displayName = 'Symbol';
     static propType = {
-        id: PropTypes.string.isRequired
+        id: PropTypes.string.isRequired,
+        viewBox: PropTypes.string,
+        preserveAspectRatio: PropTypes.string
     };
     render() {
         let {props} = this;
 
-        return <G id={props.id}>
-            <ViewBox
-                {...props}
-                viewbox={props.viewbox}
-                preserveAspectRatio={props.preserveAspectRatio}
-            >
-                {props.children}
-            </ViewBox>
-        </G>;
+        let viewBox = props.viewBox;
+        if (props.viewbox) {
+            viewBox = props.viewbox;
+            console.warn('Prop `viewbox` is deprecated. please use `viewBox` instead.');
+        }
+
+        let content = viewBox ? <ViewBox
+            viewBox={viewBox}
+            preserveAspectRatio={props.preserveAspectRatio}
+        >
+            {props.children}
+        </ViewBox> : props.children;
+
+        return <Defs>
+            <G id={props.id}>
+                {content}
+            </G>
+        </Defs>;
     }
 }