Trying to manage instances and ref in React with Tippy without creating new react components.

Tippy.js

import React from 'react'
import useTippy from './useTippy.js'

const Example = () => {
  const [tippyInstance, tippyElementRef] = useTippy({content: 'Test'})

  return <div>
  	<span ref={tippyElementRef}>Tippy</span>
  </div>
}

useTippy.js

import { useState, useCallback } from 'react'
import tippy from 'tippy.js'

const useTippy = options => {
	const [instance, setInstance] = useState(null)

	const ref = useCallback(
		node => {
			if (node !== null) {
				setInstance(tippy(node, options))
			}
		},
		[options]
	)

	return [instance, ref]
}

export default useTippy