Bug: OverlayTrigger + custom component = Warning: Function components cannot be given refs

Prerequisites

• I am using the correct version of React-Bootstrap for my version of Bootstrap
• I have searched for duplicate or closed issues
• I have read the contributing guidelines

Describe the bug

I’m trying to use the OverlayTrigger component by copying the code of one of the demos at https://react-bootstrap.github.io/components/overlays/#tooltips .

If I pass a <Button> component as a child to the OverlayTrigger component, the tooltip shows as expected, but if I pass a custom component (a component that just returns a simple div), I get this warning:

Warning: Function components cannot be given refs. Attempts to access this ref will fail.
Did you mean to use React.forwardRef()?

Check the render method of `OverlayTrigger`.

Expected behavior

I should be able to pass any components to OverlayTrigger.

To Reproduce

Open the repro example I made.

Reproducible Example

https://codesandbox.io/s/distracted-robinson-kded3?file=/src/App.js

Screenshots

No response

What operating system(s) are you seeing the problem on?

macOS

What browser(s) are you seeing the problem on?

Chrome

What version of React-Bootstrap are you using?

2.1.1

What version of Bootstrap are you using?

5.1.3

Additional context

No response

[alexandernst]

@GaylordP ^ I hope this helps

[GaylordP]

Thank you very much for these details 😃