Custom content type for Headless Tippy Singleton

[angeloanan]

Discussed in #355

Moved to an issue since its been ~4 months without any update.

^{Originally posted by angeloanan March 12, 2022}
Hi,

I would like to use a custom Typescript type for the render method of a Headless Tippy Singleton. Here is an example code:

import Tippy, { useSingleton } from '@tippyjs/react'

interface CustomRenderDataType {
  some: string
  data: string[]
}

const customDataToPass: CustomRenderDataType = { some: 'custom', data: ['type'] }

const Something = () => {
  const [source, target] = useSingleton({ overrides: ['render'] })

  return (
    <>
      <Tippy
        singleton={source}
        render={(attrs, content) => <SomeComponent attr={attrs} data={content} />}
      />
      {/*               ^ I want this to have a custom type! */}
      {/* In here, Typescript complains that ReactNode (`content`) is not assignable to type 'CustomRenderDataType'! */}

      <Tippy singleton={target} content={customDataToPass} />
      {/*                       ^ Typescript allows this but technically should be disallowed since CustomRenderDataType != React.ReactNode */}
    </>
  )
}

// Example render Component that takes in a custom type
const SomeComponent = ({ attr, data }: { attr: unknown; data: CustomRenderDataType }) => {
  // TODO
  return <></>
}

Is there a way to do it as of now?