'use client' import classNames from 'classnames' import type { FC } from 'react' import React from 'react' import { Tooltip as ReactTooltip } from 'react-tooltip' // fixed version to 5.8.3 https://github.com/ReactTooltip/react-tooltip/issues/972 import 'react-tooltip/dist/react-tooltip.css' type TooltipProps = { selector: string content?: string disabled?: boolean htmlContent?: React.ReactNode className?: string // This should use !impornant to override the default styles eg: '!bg-white' position?: 'top' | 'right' | 'bottom' | 'left' clickable?: boolean children: React.ReactNode noArrow?: boolean } const Tooltip: FC = ({ selector, content, disabled, position = 'top', children, htmlContent, className, clickable, noArrow, }) => { return (
{React.cloneElement(children as React.ReactElement, { 'data-tooltip-id': selector, }) } {htmlContent && htmlContent}
) } export default Tooltip