7da2f1fb8d
* Add FAQ entry for Toolkit + custom component * Add tooltip example for custom component * Add link to example in Tooltip doc page * Add link to issue Co-authored-by: afc163 <afc163@gmail.com> Signed-off-by: Dan M. <danspamable@gmail.com> * Replace custom props with HTMLSpanElement props Co-authored-by: afc163 <afc163@gmail.com> Signed-off-by: Dan M. <danspamable@gmail.com> * Import handlers as types Co-authored-by: afc163 <afc163@gmail.com> Signed-off-by: Dan M. <danspamable@gmail.com> * Fix formatting Co-authored-by: afc163 <afc163@gmail.com> Signed-off-by: Dan M. <danspamable@gmail.com> * Update components/tooltip/demo/wrap-custom-component.tsx Co-authored-by: afc163 <afc163@gmail.com> Signed-off-by: Dan M. <danspamable@gmail.com> * Update components/tooltip/index.en-US.md Co-authored-by: afc163 <afc163@gmail.com> Signed-off-by: Dan M. <danspamable@gmail.com> * Add link for Wrap Custom Component * Update components/tooltip/demo/wrap-custom-component.tsx Signed-off-by: thinkasany <480968828@qq.com> * test: update snap * fix md lint * chore: update docs --------- Signed-off-by: Dan M. <danspamable@gmail.com> Signed-off-by: thinkasany <480968828@qq.com> Co-authored-by: afc163 <afc163@gmail.com> Co-authored-by: thinkasany <480968828@qq.com> Co-authored-by: 𝑾𝒖𝒙𝒉 <wxh1220@gmail.com>
1.7 KiB
Why does the warning findDOMNode is deprecated sometimes appear in strict mode?
This is due to the implementation of rc-trigger. rc-trigger forces children to accept ref, otherwise it will fall back to findDOMNode, so children need to be native html tags. If not, you need to use React.forwardRef transparently passes ref to native html tags.
findDOMNode is deprecatedreproduce: https://codesandbox.io/p/sandbox/finddomnode-c5hy96- Using
forwardRefto fix: https://codesandbox.io/p/sandbox/no-finddomnode-warning-forked-gdxczs
Why is the tooltip for my custom component not opening?
Similar issues: #15909, #12812.
Please ensure that the child node to accept onMouseEnter, onMouseLeave, onPointerEnter, onPointerLeave, onFocus, and onClick events, If you create your own component and do not explicitly add these mouse and pointer events as props, the tooltip will never appear. See Example.
What's the placement logic?
It will follow placement config when screen has enough space. And flip when space is not enough (Such as top to bottom or topLeft to bottomLeft). Single direction such as top bottom left right will auto shift on the view:
When placement is set to edge align such as topLeft bottomRight, it will only do flip but not do shift.