Chakra-ui: Request to make <Stack> props `isInline` & `isReverse` accept an array for responsive style

[Calvein]

I would love if those props could be used "responsively", in the meantime, I created an hook to get the current breakpoint and I use it to set the correct value, it works well because they are boolean values but I don't think it's generic enough. Here's how I use it:

const MyComponent = () => {
  const currentBreakpoint = useCurrentBreakpoint()

  return (
    <Stack isInline={[false, true, true, true][currentBreakpoint]}>
      <Box>1</Box>
      <Box>2</Box>
    </Stack>
  )
}

And here's a working example, with the hook:

https://codesandbox.io/s/chakra-ui-isinline-responsive-scfye

If you reckon that would work, I'd gladly make a PR :)

[segunadebayo]

@Calvein , I'm glad you found a walkaround for this.

We've accounted for this in preparation for the next release. We're deprecating isInline prop in favour of direction, and you will be able to pass responsive direction values. Sounds good?

Looked at your solution and it looks interesting as well. Thanks for sharing.

[Calvein]

Sounds even better than good 😄

[julians300]

When is this responsive update planned to get released?