Typescript intl.formatMessage aria-label wants string, not React.ReactNode

[SofiaGR]

So, I'm not sure if this is an issue, but I'm also wondering if anyone has ever had issues with using intl.formatMessage with the aria-label property? Since intl.formatMessage only returns React.ReactNode from what I understood, the error below occurs:

https://codesandbox.io/s/pensive-jones-b1tewt?file=/src/App.tsx

(property) JSX.IntrinsicElements.button: React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>
Type '{ children: string; "aria-label": ReactNode; }' is not assignable to type 'DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>'.
  Type '{ children: string; "aria-label": ReactNode; }' is not assignable to type 'ButtonHTMLAttributes<HTMLButtonElement>'.
    Types of property ''aria-label'' are incompatible.
      Type 'ReactNode' is not assignable to type 'string | undefined'.
        Type 'null' is not assignable to type 'string | undefined'.ts(2322)

I could convert to string using 'as string'...but yeah. :/

Replaced {values: {type: 'test'}} with {type: 'test'} and fixed it 😬

[longlho]

the codesandbox doesn't throw typechecking err for me. Are you just using an old version?
formatMessage has a type overload where if you pass in values as a Record of all primitive types it'll return a string so it should work