inline tw prop doesn't work but it works inside styled

[culda]

I've got a strange problem where neither the tw nor css props don't work.
Both <div tw={'flex'}> and <div css={[twflex]}> resolve to <div class='[object Object]>

However these 2 ways work fine:

  const Comp = styled.div`
    ${tw`flex`}
  `

and

const Comp = tw`bg-black`
<Comp/>

my package.json

    "@emotion/css": "^11.7.1",
    "@emotion/react": "^11.8.1",
    "@emotion/styled": "^11.8.1",
    "tailwindcss": "2.2.18",
    "twin.macro": "2.8.2",

My .d.ts

import styledImport from '@emotion/styled'
import { css as cssImport, theme as themeImport } from '@emotion/react'

declare module 'twin.macro' {
  const styled: typeof styledImport
  const css: typeof cssImport
  const theme: typeof themeImport
}
...

I have this in my tsconfig

    "jsxImportSource": "@emotion/react",

Anybody else run into this?