Merge pull request vault-development#30 from uphold-forks/bugfix/svg-…

…width-height-missing

Update to re-render when svgXmlData and fill props change

index.js

@@ -41,7 +41,7 @@ const ACCEPTED_SVG_ELEMENTS = [
 ];
 
 // Attributes from SVG elements that are mapped directly.
-const SVG_ATTS = ['viewBox'];
+const SVG_ATTS = ['viewBox', 'width', 'height'];
 const G_ATTS = ['id'];
 
 const CIRCLE_ATTS = ['cx', 'cy', 'r'];
@@ -82,7 +82,7 @@ class SvgUri extends Component{
   constructor(props){
     super(props);
 
-    this.state = {svgXmlData: props.svgXmlData};
+    this.state = {fill: props.fill, svgXmlData: props.svgXmlData};
 
     this.createSVGElement     = this.createSVGElement.bind(this);
     this.obtainComponentAtts  = this.obtainComponentAtts.bind(this);
@@ -103,12 +103,20 @@ class SvgUri extends Component{
   }
 
   componentWillReceiveProps (nextProps){
-    if (nextProps.source) {
+    if (nextProps.source) { 
       const source = resolveAssetSource(nextProps.source) || {};
       const oldSource = resolveAssetSource(this.props.source) || {};
       if(source.uri !== oldSource.uri){
         this.fetchSVGData(source.uri);
-      }
+      } 
+    }
+
+    if (nextProps.svgXmlData !== this.props.svgXmlData) {
+      this.setState({ svgXmlData: nextProps.svgXmlData });
+    }
+
+    if (nextProps.fill !== this.props.fill) {
+      this.setState({ fill: nextProps.fill });
     }
   }
 
@@ -210,10 +218,10 @@ class SvgUri extends Component{
 
     const componentAtts =  Array.from(attributes)
       .map(utils.camelCaseNodeName)
-      .map(utils.removePixelsFromNodeValue)
+      .map(utils.removePixelsFromNodeValue) 
       .filter(utils.getEnabledAttributes(enabledAttributes.concat(COMMON_ATTS)))
       .reduce((acc, {nodeName, nodeValue}) => {
-        acc[nodeName] = this.props.fill && nodeName === 'fill' ? this.props.fill : nodeValue
+        acc[nodeName] = this.state.fill && nodeName === 'fill' ? this.state.fill : nodeValue
         return acc
       }, {});
     Object.assign(componentAtts, styleAtts);