Add gradientUnits support

elements/Gradient.js

@@ -1,46 +0,0 @@
-import {Children, Component} from 'react';
-import percentToFloat from '../lib/percentToFloat';
-import Stop from './Stop';
-import Color from 'color';
-import extractOpacity from '../lib/extract/extractOpacity';
-import _ from 'lodash';
-
-class Gradient extends Component{
-    static displayName = 'Gradient';
-
-    getGradient = () => {
-        let stops = {};
-        Children.forEach(this.props.children, child => {
-            if (child.type === Stop) {
-                if (child.props.stopColor && child.props.offset) {
-                    // convert percent to float.
-                    let offset = percentToFloat(child.props.offset);
-
-                    // add stop
-                    stops[offset] = Color(child.props.stopColor).alpha(extractOpacity(child.props.stopOpacity));
-                }
-            } else {
-                console.warn('\'Gradient\' can only receive \'Stop\' elements as children');
-            }
-        });
-
-        let sorted = _.sortBy(_.map(stops, (stop, offset) => {
-            return {stop, offset};
-        }), 'offset');
-        let gradient = [];
-
-        sorted.forEach(({stop}) => {
-            let channels = stop.rgbaArray();
-            gradient.push(channels[0] / 255);
-            gradient.push(channels[1] / 255);
-            gradient.push(channels[2] / 255);
-            gradient.push(channels[3]);
-        });
-
-        gradient.push(...sorted.map(({offset}) => +offset));
-        return gradient;
-    };
-}
-
-export default Gradient;
-

elements/LinearGradient.js

@@ -1,10 +1,10 @@
-import React, {PropTypes} from 'react';
+import React, {PropTypes, Component} from 'react';
 import {numberProp} from '../lib/props';
-import Gradient from './Gradient';
+import extractGradient from '../lib/extract/extractGradient';
 import createReactNativeComponentClass from 'react-native/Libraries/Renderer/src/renderers/native/createReactNativeComponentClass';
 import {LinearGradientAttributes} from '../lib/attributes';
 
-class LinearGradient extends Gradient{
+class LinearGradient extends Component{
     static displayName = 'LinearGradient';
     static propTypes = {
         x1: numberProp.isRequired,
@@ -28,8 +28,7 @@ class LinearGradient extends Gradient{
             y1={props.y1.toString()}
             x2={props.x2.toString()}
             y2={props.y2.toString()}
-            gradient={this.getGradient()}
-            name={props.id}
+            {...extractGradient(this.props)}
         />;
 
     }

elements/RadialGradient.js

@@ -1,10 +1,10 @@
-import React, {PropTypes} from 'react';
+import React, {PropTypes, Component} from 'react';
 import {numberProp} from '../lib/props';
-import Gradient from './Gradient';
+import extractGradient from '../lib/extract/extractGradient';
 import createReactNativeComponentClass from 'react-native/Libraries/Renderer/src/renderers/native/createReactNativeComponentClass';
 import {RadialGradientAttributes} from '../lib/attributes';
 
-class RadialGradient extends Gradient{
+class RadialGradient extends Component{
     static displayName = 'RadialGradient';
     static propTypes = {
         fx: numberProp.isRequired,
@@ -34,8 +34,7 @@ class RadialGradient extends Gradient{
             ry={(props.ry || props.r).toString()}
             cx={props.cx.toString()}
             cy={props.cy.toString()}
-            gradient={this.getGradient()}
-            name={props.id}
+            {...extractGradient(this.props)}
         />;
 
     }