iterative/vscode-dvc

View on GitHub
webview/src/experiments/components/overflowHoverTooltip/OverflowHoverTooltip.tsx

Summary

Maintainability
A
0 mins
Test Coverage
A
100%
import { TippyProps } from '@tippyjs/react'
import React, { useRef } from 'react'
import { useIsFullyContained } from './useIsFullyContained'
import Tooltip, {
  HEADER_TOOLTIP_DELAY
} from '../../../shared/components/tooltip/Tooltip'

export const OverflowHoverTooltip: React.FC<
  Pick<TippyProps, 'content' | 'children'>
> = ({ children, content }) => {
  const wrapperRef = useRef<HTMLDivElement>(null)
  const isDisabled = useIsFullyContained(wrapperRef)
  return (
    <Tooltip
      content={content}
      placement="bottom-start"
      disabled={isDisabled}
      delay={HEADER_TOOLTIP_DELAY}
      ref={wrapperRef}
    >
      {children}
    </Tooltip>
  )
}