chore: remove deprecated tooltip provider

Author: gabrieljablonski

jest.config.ts

@@ -25,8 +25,6 @@ export default {
     // dev stuff
     '!src/*',
     '!src/**/*.d.ts',
-    // deprecated
-    '!src/components/TooltipProvider/*',
   ],
 
   // The directory where Jest should output its coverage files

src/components/Tooltip/Tooltip.tsx

@@ -10,7 +10,6 @@ import {
   cssTimeToMs,
 } from 'utils'
 import type { IComputedPosition } from 'utils'
-import { useTooltip } from 'components/TooltipProvider'
 import coreStyles from './core-styles.module.css'
 import styles from './styles.module.css'
 import type {
@@ -85,10 +84,6 @@ const Tooltip = ({
   )
   const wasShowing = useRef(false)
   const lastFloatPosition = useRef<IPosition | null>(null)
-  /**
-   * @todo Remove this in a future version (provider/wrapper method is deprecated)
-   */
-  const { anchorRefs, setActiveAnchor: setProviderActiveAnchor } = useTooltip(id)
   const hoveringTooltip = useRef(false)
   const [anchorsBySelect, setAnchorsBySelect] = useState<HTMLElement[]>([])
   const mounted = useRef(false)
@@ -292,7 +287,6 @@ const Tooltip = ({
        * at the same time the tooltip gets triggered
        */
       setActiveAnchor(null)
-      setProviderActiveAnchor({ current: null })
       return
     }
     if (delayShow) {
@@ -301,7 +295,6 @@ const Tooltip = ({
       handleShow(true)
     }
     setActiveAnchor(target)
-    setProviderActiveAnchor({ current: target })
 
     if (tooltipHideDelayTimerRef.current) {
       clearTimeout(tooltipHideDelayTimerRef.current)
@@ -463,15 +456,15 @@ const Tooltip = ({
   ])
 
   useEffect(() => {
-    const elementRefs = new Set(anchorRefs)
+    const elementRefs = new Set<HTMLElement>()
 
     anchorsBySelect.forEach((anchor) => {
-      elementRefs.add({ current: anchor })
+      elementRefs.add(anchor)
     })
 
     const anchorById = document.querySelector<HTMLElement>(`[id='${anchorId}']`)
     if (anchorById) {
-      elementRefs.add({ current: anchorById })
+      elementRefs.add(anchorById)
     }
 
     const handleScrollResize = () => {
@@ -593,7 +586,7 @@ const Tooltip = ({
 
     enabledEvents.forEach(({ event, listener }) => {
       elementRefs.forEach((ref) => {
-        ref.current?.addEventListener(event, listener)
+        ref.addEventListener(event, listener)
       })
     })
 
@@ -620,7 +613,7 @@ const Tooltip = ({
       }
       enabledEvents.forEach(({ event, listener }) => {
         elementRefs.forEach((ref) => {
-          ref.current?.removeEventListener(event, listener)
+          ref.removeEventListener(event, listener)
         })
       })
     }
@@ -632,7 +625,6 @@ const Tooltip = ({
     activeAnchor,
     updateTooltipPosition,
     rendered,
-    anchorRefs,
     anchorsBySelect,
     // the effect uses the `actual*Events` objects, but this should work
     openEvents,

src/components/TooltipController/TooltipController.tsx

@@ -11,7 +11,6 @@ import type {
   ChildrenType,
   TooltipRefProps,
 } from 'components/Tooltip/TooltipTypes'
-import { useTooltip } from 'components/TooltipProvider'
 import { cssSupports } from 'utils'
 import clsx from 'clsx'
 import type { ITooltipController } from './TooltipControllerTypes'
@@ -77,10 +76,6 @@ const TooltipController = React.forwardRef<TooltipRefProps, ITooltipController>(
     const [tooltipClassName, setTooltipClassName] = useState<string | null>(null)
     const [activeAnchor, setActiveAnchor] = useState<HTMLElement | null>(null)
     const styleInjectionRef = useRef(disableStyleInjection)
-    /**
-     * @todo Remove this in a future version (provider/wrapper method is deprecated)
-     */
-    const { anchorRefs, activeAnchor: providerActiveAnchor } = useTooltip(id)
 
     const getDataAttributesFromAnchorElement = (elementReference: HTMLElement) => {
       const dataAttributes = elementReference?.getAttributeNames().reduce((acc, name) => {
@@ -206,7 +201,7 @@ const TooltipController = React.forwardRef<TooltipRefProps, ITooltipController>(
     }, [])
 
     useEffect(() => {
-      const elementRefs = new Set(anchorRefs)
+      const elementRefs = new Set<HTMLElement>()
 
       let selector = anchorSelect
       if (!selector && id) {
@@ -216,7 +211,7 @@ const TooltipController = React.forwardRef<TooltipRefProps, ITooltipController>(
         try {
           const anchorsBySelect = document.querySelectorAll<HTMLElement>(selector)
           anchorsBySelect.forEach((anchor) => {
-            elementRefs.add({ current: anchor })
+            elementRefs.add(anchor)
           })
         } catch {
           /* c8 ignore start */
@@ -230,14 +225,14 @@ const TooltipController = React.forwardRef<TooltipRefProps, ITooltipController>(
 
       const anchorById = document.querySelector<HTMLElement>(`[id='${anchorId}']`)
       if (anchorById) {
-        elementRefs.add({ current: anchorById })
+        elementRefs.add(anchorById)
       }
 
       if (!elementRefs.size) {
         return () => null
       }
 
-      const anchorElement = activeAnchor ?? anchorById ?? providerActiveAnchor.current
+      const anchorElement = activeAnchor ?? anchorById
 
       const observerCallback: MutationCallback = (mutationList) => {
         mutationList.forEach((mutation) => {
@@ -272,7 +267,7 @@ const TooltipController = React.forwardRef<TooltipRefProps, ITooltipController>(
         // Remove the observer when the tooltip is destroyed
         observer.disconnect()
       }
-    }, [anchorRefs, providerActiveAnchor, activeAnchor, anchorId, anchorSelect])
+    }, [activeAnchor, anchorId, anchorSelect])
 
     useEffect(() => {
       /* c8 ignore start */
@@ -358,7 +353,7 @@ const TooltipController = React.forwardRef<TooltipRefProps, ITooltipController>(
       afterShow,
       afterHide,
       activeAnchor,
-      setActiveAnchor: (anchor: HTMLElement | null) => setActiveAnchor(anchor),
+      setActiveAnchor,
       role,
     }
 

src/components/TooltipProvider/TooltipProvider.tsx

@@ -15,7 +15,6 @@ import type {
   TooltipRefProps,
 } from './components/Tooltip/TooltipTypes'
 import type { ITooltipController } from './components/TooltipController/TooltipControllerTypes'
-import type { ITooltipWrapper } from './components/TooltipProvider/TooltipProviderTypes'
 
 // those content will be replaced in build time with the `react-tooltip.css` builded content
 const TooltipCoreStyles = 'react-tooltip-core-css-placeholder'
@@ -35,7 +34,6 @@ if (typeof window !== 'undefined') {
 }
 
 export { TooltipController as Tooltip } from './components/TooltipController'
-export { TooltipProvider, TooltipWrapper } from './components/TooltipProvider'
 export type {
   ChildrenType,
   DataAttribute,
@@ -45,7 +43,6 @@ export type {
   VariantType,
   WrapperType,
   ITooltipController as ITooltip,
-  ITooltipWrapper,
   IPosition,
   Middleware,
   TooltipRefProps,