Function Tooltip

starters/hooks/src/Tooltip.tsx:30–56

({children, state, triggerRef, ...props}: TooltipProps)

};

function Tooltip({children, state, triggerRef, ...props}: TooltipProps) {
  let tooltipRef = useRef<HTMLDivElement>(null);
  let {overlayProps, placement} = useOverlayPosition({
    placement: 'top',
    targetRef: triggerRef,
    overlayRef: tooltipRef,
    isOpen: state.isOpen
  });
  let {tooltipProps} = useTooltip(props, state);

  if (!state.isOpen) {
    return null;
  }

  return (
    <Overlay>
      <div
        {...overlayProps}
        {...tooltipProps}
        ref={tooltipRef}
        className="react-aria-Tooltip"
        data-placement={placement}>
        {children}
      </div>
    </Overlay>
  );
}

export function TooltipTrigger(props: TooltipTriggerProps) {
  let state = useTooltipTriggerState(props);