`gridTemplate` is not supported?

🐛 Bug report

The grid-template CSS property is not supported as a gridTemplate prop.

[ianstormtaylor]

@dodas @segunadebayo @with-heart I’ve seen this response to a handful of different “where is the X prop?” questions. I’d encourage you to re-think this policy, it’s extremely confusing and frustrating as an end user.

The existing API encourages thinking of props mapping directly to CSS properties, but then it omits props seemingly at random, so you can never know which ones are supported at which aren’t…

// supported
gripColumnGap
gridTemplateRows
flexDirection
borderColor
borderStyle

// unsupported
columnGap
gridTemplate
flexFlow
borderImage
clipPath

There doesn’t seem to be any reasoning behind which props get supported and which don’t…

So whenever you try to set one of these props you run into weird errors and have to realize that Chakra doesn’t recognize it. Then you have to use both the existing props that do work and the cx prop to achieve what you were doing, which just complicates the library’s usage even further.

[segunadebayo]

I’ve added support for the missing grid props and flex-flow.