Support for React-Native specific properties

There are several CSS properties that are specific to React-Native that are supported by styled-components/native. For example the following properties are part of React-Native but appear as errors when using this plugin:

const Main = styled.View`
  shadow-color: black;
  shadow-opacity: 0.5;
  shadow-offset: 2px 2px;
`

Would React-Native specific properties be something to consider supporting?

[sregg]

This works for me:

{
  "compilerOptions": {
    "plugins": [
      {
        "name": "typescript-styled-plugin",
        "lint": {
          "validProperties": [
            "shadow-color",
            "shadow-opacity",
            "shadow-offset",
            "shadow-radius",
            "padding-horizontal",
            "padding-vertical",
            "margin-vertical",
            "margin-horizontal",
            "tint-color",
            "aspect-ratio",
            "elevation"
          ]
        }
      }
    ]
  }
}

notice validProperties is an actual array, not a csv string

[lidonghua]

After inspecting source code of the plugin, I managed to find a working solution.

Edit your tsconfig.json like this:

{
  "compilerOptions": {
    "plugins": [
      {
        "name": "typescript-styled-plugin",
        "lint": {
          "validProperties": "shadow-color,shadow-opacity,shadow-offset"
        }
      }
    ]
  }
}

Maybe it helps.