From 642af5b7decf16fad52fe0e9279c670b6a8aea22 Mon Sep 17 00:00:00 2001
From: Matias Sebastian Cortes <matias.s.cortes@gmail.com>
Date: Wed, 18 Jan 2017 12:16:49 -0300
Subject: [PATCH] Fix TransformAtts function

---
 index.js | 13 ++++++++++---
 utils.js | 12 +++++++++---
 2 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/index.js b/index.js
index 63af6d10..8009f68f 100644
--- a/index.js
+++ b/index.js
@@ -41,7 +41,7 @@ const SVG_ATTS = ['viewBox'];
 const G_ATTS = ['id'];
 const CIRCLE_ATTS = ['cx', 'cy', 'r', 'fill', 'stroke'];
 const PATH_ATTS = ['d', 'fill', 'stroke'];
-const RECT_ATTS = ['width', 'height', 'fill', 'stroke'];
+const RECT_ATTS = ['width', 'height', 'fill', 'stroke', 'x', 'y'];
 const LINEARG_ATTS = ['id', 'x1', 'y1', 'x2', 'y2'];
 const RADIALG_ATTS = ['id', 'cx', 'cy', 'r'];
 const STOP_ATTS = ['offset'];
@@ -150,15 +150,22 @@ class SvgUri extends Component{
   }
 
   obtainComponentAtts({attributes}, enabledAttributes) {
-    return Array.from(attributes)
+    let styleAtts = {};
+    Array.from(attributes).forEach(({nodeName, nodeValue}) => {
+                Object.assign(styleAtts, utils.transformStyle(nodeName, nodeValue, this.props.fill));
+    });
+
+    let componentAtts =  Array.from(attributes)
       .map(utils.camelCaseNodeName)
       .map(utils.removePixelsFromNodeValue)
-      .map(utils.transformStyle)
       .filter(utils.getEnabledAttributes(enabledAttributes))
       .reduce((acc, {nodeName, nodeValue}) => ({
         ...acc,
         [nodeName]: this.props.fill && nodeName === 'fill' ? this.props.fill : nodeValue,
       }), {});
+    Object.assign(componentAtts, styleAtts);
+
+    return componentAtts;
   }
 
   inspectNode(node){
diff --git a/utils.js b/utils.js
index 2444961d..3dd33f57 100644
--- a/utils.js
+++ b/utils.js
@@ -1,15 +1,21 @@
 export const camelCase = value => value.replace(/-([a-z])/g, g => g[1].toUpperCase());
 
 export const camelCaseNodeName = ({nodeName, nodeValue}) => ({nodeName: camelCase(nodeName), nodeValue});
+
 export const removePixelsFromNodeValue = ({nodeName, nodeValue}) => ({nodeName, nodeValue: nodeValue.replace('px', '')});
-export const transformStyle = ({nodeName, nodeValue}) => {
+
+export const transformStyle = (nodeName, nodeValue, fillProp) => {
   if (nodeName === 'style') {
     return nodeValue.split(';')
       .reduce((acc, attribute) => {
         const [property, value] = attribute.split(':');
-        return {...acc, [camelCase(property)]: value};
+        if (property == "")
+            return acc;
+        else
+            return {...acc, [camelCase(property)]: fillProp && property === 'fill' ? fillProp : value};
       }, {});
   }
-  return {nodeName, nodeValue};
+  return null;
 };
+
 export const getEnabledAttributes = enabledAttributes => ({nodeName}) => enabledAttributes.includes(nodeName);