Set visibility:hidden on fade after animation completes

Author: tcbegley

src/components/Fade.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {useState} from 'react';
 import PropTypes from 'prop-types';
 import {omit} from 'ramda';
 import {Fade as RSFade} from 'reactstrap';
@@ -17,12 +17,18 @@ const Fade = props => {
     style,
     ...otherProps
   } = props;
+
+  // set visibility to hidden after transition has completed to hide tooltips
+  const [hidden, setHidden] = useState(!is_in);
+
   return (
     <RSFade
       baseClass={base_class}
       baseClassActive={base_class_active}
       in={is_in}
-      style={is_in ? style : {visibility: 'hidden', ...style}}
+      style={hidden ? {visibility: 'hidden', ...style} : style}
+      onEnter={() => setHidden(false)}
+      onExited={() => setHidden(true)}
       {...omit(['setProps'], otherProps)}
       data-dash-is-loading={
         (loading_state && loading_state.is_loading) || undefined