TVke/react-native-tailwindcss

Getting values from PlatformColor in tailwind.config.js does not work

thomaschaaf opened this issue · 0 comments

I am trying to use the new PlatformColor in the tailwind.config.js. Sadly it does not seem to work.

import { Platform, PlatformColor } from 'react-native';

const isIOS = Platform.OS === 'ios';

module.exports = {
  theme: {
    extend: {
      colors: {
        link: isIOS ? PlatformColor('systemRed') : 'blue',
      },
    },
  },
  variants: {},
  plugins: [],
};
[Sun Jul 19 2020 00:40:29.381]  ERROR    Invariant Violation: Invalid prop `backgroundColor` supplied to `StyleSheet bgLinkSemantic`: systemRed
Valid color formats are
  - '#f0f' (#rgb)
  - '#f0fc' (#rgba)
  - '#ff00ff' (#rrggbb)
  - '#ff00ff00' (#rrggbbaa)
  - 'rgb(255, 255, 255)'
  - 'rgba(255, 255, 255, 1.0)'
  - 'hsl(360, 100%, 100%)'
  - 'hsla(360, 100%, 100%, 1.0)'
  - 'transparent'
  - 'red'
  - 0xff00ff00 (0xrrggbbaa)

StyleSheet bgLinkSemantic: {
  "backgroundColor": "systemRed"
}