useTooltipContext

Description

The useTooltipContext hook provides access to the tooltip context, allowing child components to interact with the tooltip state and positioning. This hook must be used within a Tooltip or Popover provider component.

Hook

Returns

The hook returns an object with the following properties:

Property	Type	Description
open	boolean	Current open/closed state of the tooltip
setOpen	(open: boolean) => void	Function to programmatically open or close the tooltip

Usage

This hook is primarily used internally by TooltipTrigger, TooltipContent, PopoverTrigger, and PopoverContent components but it can be used in custom components that need access to the tooltip state.

Example

import { useTooltipContext } from '@tmedxp/react-components';

const CustomText = () => {
  const { open } = useTooltipContext();
  return <p>Tooltip is {open ? 'open' : 'closed'}</p>;
};

const CustomComponent = () => {
  return (
    <Popover>
      <CustomText />
      <PopoverTrigger>
        <button>Toggle Tooltip</button>
      </PopoverTrigger>
      <PopoverContent>
        <span>Some text</span>
      </PopoverContent>
    </Popover>
  );
};

export { CustomTooltipComponent };