TVke / react-native-tailwindcss

A react-native style system based on TailwindCSS
https://tvke.github.io/react-native-tailwindcss/
MIT License
565 stars 34 forks source link

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

Closed thomaschaaf closed 4 years ago

thomaschaaf commented 4 years ago

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"
}