fix: svg style mapping (#96)

Author: marklawlor

src/compiler/__tests__/declarations.test.tsx

@@ -5,7 +5,9 @@ const tests = [
   ["-rn-ripple-color: black;", [{ d: [["black", ["android_ripple", "color"]]], s: [1, 1] }]],
   ["-rn-ripple-style: borderless;", [{ d: [[true, ["android_ripple", "borderless"]]], s: [1, 1] }]],
   ["caret-color: black", [{ d: [["#000", ["cursorColor"]]], s: [1, 1] }]],
+  ["fill: black;", [{ d: [["#000", ["fill"]]], s: [1, 1] }]],
   ["stroke: black;", [{ d: [["#000", ["stroke"]]], s: [1, 1] }]],
+  ["stroke-width: 1px;", [{ d: [[1, ["strokeWidth"]]], s: [1, 1] }]],
   ["rotate: 3deg;", [{ d: [[[{}, "rotateZ", "3deg"], "rotateZ"]], s: [1, 1] }]],
   ["rotate: x 3deg;", [{ d: [[[{}, "rotateX", "3deg"], "rotateX"]], s: [1, 1] }]],
 ] as const;

src/compiler/atRules.ts

@@ -82,6 +82,9 @@ export function parsePropAtRule(rules?: (Rule | PropAtRule)[]) {
   // Include any default mapping here
   const mapping: StyleRuleMapping = {
     "caret-color": ["cursorColor"],
+    "fill": ["fill"],
+    "stroke": ["stroke"],
+    "stroke-width": ["strokeWidth"],
     "-webkit-line-clamp": ["numberOfLines"],
     "-rn-ripple-color": ["android_ripple", "color"],
     "-rn-ripple-style": ["android_ripple", "borderless"],

src/compiler/declarations.ts

@@ -2458,7 +2458,6 @@ export function parseSVGPaint(
     return;
   }
 
-  builder.addMapping({ [property]: [property] });
   builder.addDescriptor(property, parsedValue);
 }