Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Headless Singleton calls render ahead of time #368

Open
yogev83 opened this issue Sep 23, 2022 · 0 comments
Open

Headless Singleton calls render ahead of time #368

yogev83 opened this issue Sep 23, 2022 · 0 comments

Comments

@yogev83
Copy link

yogev83 commented Sep 23, 2022

Hi, I don't know if it's something that I am doing wrong or maybe it's a bug.

I have a Headless Singleton Tipply:

<Tippy
    singleton={source}
    delay={500}
></Tippy>

 <Tippy singleton={target} placement="bottom" render={(attr, content, inst) => {
       console.log("render", attr, inst);
       return <Bubble>{content}</Bubble>    
 }}>
    <button>Trigger</button>
</Tippy>

The problem is, the render callback is being called immediately when I hover over the trigger element and then again once the delay time is up and the tooltip is actually being mounted.
That behavior prevents me from firing up entering animation on time since the Bubble component is being rendered too early.

I could not find anything in the attr object, or in the inst object that might indicate a "real mounting". It does give me access to "onMount()" and "onShow()" callbacks, but maybe I am not doing it right?...
(I tried: inst.onMount(() => {...}) and also: inst.onMount = () => {...})

Please note that this behavior does not happen on a regular (not singleton) Headless Tippy

Would really appreciate your help. Thanks!


Sandbox link for demo

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant