src/ui/components/utils/TooltipComponent.tsx - master - QuickMeet/Chat.Desktop

src/ui/components/utils/TooltipComponent.tsx

30 строк600 B

Jean Brito

feat: New UI using Fuselage (#2927)

13 сен 2024, 23:05

13 сен 2024, 23:052f60cb9

import {
  Tooltip,
  PositionAnimated,
  AnimatedVisibility,
} from '@rocket.chat/fuselage';
import type { ReactElement, ReactNode } from 'react';
import { useRef } from 'react';

type TooltipComponentProps = {
  title: ReactNode;
  anchor: Element;
};

export const TooltipComponent = ({
  title,
  anchor,
}: TooltipComponentProps): ReactElement => {
  const ref = useRef(anchor);

  return (
    <PositionAnimated
      anchor={ref}
      placement='bottom-start'
      margin={8}
      visible={AnimatedVisibility.UNHIDING}
    >
      <Tooltip>{title}</Tooltip>
    </PositionAnimated>
  );
};