Cannot pass PlatformColor or DynamicColorIOS as fill prop

Description

Hi,

I’ve been using the library for quite a while now, and I’m in the process of implementing Dark Mode on the app.

However, it seems that the transformer won’t accept fill props with colors that came from the new PlatformColor or DynamicColorIOS React Native APIs.

Not sure exactly if the culprit is the transformer or the underlying SVGR.

Any ideas on how we can add support for these new color APIs?

Error logged

[Fri Nov 13 2020 20:04:35.610]  WARN     "[object Object]" is not a valid color or brush 
G@http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false:123276:36
RNSVGSvgView
Svg@http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false:122985:36
SvgComponent

[rosskhanas]

I’m not sure what you are doing exactly, but as a workaround something like this could be done:

import { useColorScheme } from 'react-native';
const colorScheme = useColorScheme();
const fillColor = DynamicColorIOS({ light: '#ff00ff', dark: '#00ffff'})
<LocationIcon width={20} height={20} fill={fillColor.dynamic[colorScheme]} />

Unfortunately, this workaround does not work with PlatformColor 😢

[kristerkari]

I’m not sure what you are doing exactly, but as a workaround something like this could be done:

import { useColorScheme } from 'react-native';
const colorScheme = useColorScheme();
const fillColor = DynamicColorIOS({ light: '#ff00ff', dark: '#00ffff'})
<LocationIcon width={20} height={20} fill={fillColor.dynamic[colorScheme]} />