title: How to hide the tooltip after certain time
body: <p>How do i hide the tooltip after 4 seconds in react</p>
  
  <p>The tooltip classes which i used works fine. The tooltip shows up when i hover on the label and tooltip disappears when i away from the label.I want to show the tooltip for 4sec on hover and hide after that .How do i do it in react?</p>
  
  <pre><code>     &lt;Field
        name='termsAndConditions'
        label='Terms'
        component={Checkbox}
        hover={textOnTermsHover}//the text which is hovered
        time={timeAfterWhichItHide} // this is the amount of time 
                                   //the hover should display
      /&gt;
  
  
  
  
       export const Checkbox = (inputProps) =&gt; {
       const { input, label, hover, time } = inputProps
       const { name } = input
  
       return (
         &lt;label className='checkbox-a'&gt;
        &lt;input {...input}  checked={checked} 
        type='checkbox' /&gt;
        &lt;div className='checkbox-a__box' id={name} /&gt;
  
       &lt;div&gt;
       &lt;p className='checkbox--links' tabindex='0' aria- 
       describedby='tooltip-cb class='tooltip'&gt;
        &lt;u&gt;{label}&lt;/u&gt;//label on whose hover the tooltip is 
       displayed
        &lt;div role='tooltip' class='tooltip__content' id='tooltip- 
        cb-02'&gt;{hover}&lt;/div&gt; //the text which is hovered when on 
       label
      &lt;/p&gt;
      &lt;/div&gt;
      &lt;/label&gt;
      )
     }
  </code></pre>