Material-ui: Re-export the ReferenceObject type of popper.js with the Popper component

[DaniGuardiola]

• [x] I have searched the issues of this repository and believe that this is not a duplicate.

Summary 💡

Should be able to import the ReferenceObject interface from material-ui instead of popper.js.

Examples 🌈

Current way:

import { ReferenceObject } from 'popper.js'
import { Popper } from '@material-ui/core'

export default function ExamplePopperWrapper({
  anchorEl
}: {
  anchorEl: ReferenceObject
}) {
  return <Popper anchorEl={anchorEl} />
}

Proposed way:

import { Popper, PopperReferenceObject } from '@material-ui/core'

export default function ExamplePopperWrapper({
  anchorEl
}: {
  anchorEl: PopperReferenceObject
}) {
  return <Popper anchorEl={anchorEl} />
}

I don't know where it should be exported from, but somewhere in the material-ui core package. Otherwise, the abstraction is broken.

Motivation 🔦

Typing my code properly without breaking abstraction or adding dependencies that are not directly used.

Thanks :)

[eps1lon]

Would NonNullable<PopperProps['anchorEl']> work as well?

[DaniGuardiola]

@eps1lon I'm not sure what you mean, sorry

[eps1lon]

Something like

import Popper, { PopperProps } from '@material-ui/core/Popper'

export default function ExamplePopperWrapper({
  anchorEl
}: {
  anchorEl: NonNullable<PopperProps['anchorEl']>
}) {
  return <Popper anchorEl={anchorEl} />
}

[oliviertassinari]

@eps1lon's approach sounds perfect, @DaniGuardiola let us know if you face any limitations with it.

[DaniGuardiola]

@eps1lon perfect, I haven't had the chance to use it yet (been rewriting most of my project), but I'll let you know if I face any limitations. Looks good though. Thank you! :)