@mskcc/carbon-react/lib/components/Tooltip/DefinitionTooltip.js

Carbon react components for the MSKCC DSM

/**
 * MSKCC 2021, 2024
 */

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
var cx = require('classnames');
var PropTypes = require('prop-types');
var React = require('react');
var index = require('../Popover/index.js');
var useId = require('../../internal/useId.js');
var usePrefix = require('../../internal/usePrefix.js');
var deprecate = require('../../prop-types/deprecate.js');
var match = require('../../internal/keyboard/match.js');
var keys = require('../../internal/keyboard/keys.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);

const DefinitionTooltip = _ref => {
  let {
    align = 'bottom-left',
    className,
    children,
    definition,
    defaultOpen = false,
    id,
    openOnHover,
    tooltipText,
    triggerClassName,
    ...rest
  } = _ref;
  const [isOpen, setOpen] = React.useState(defaultOpen);
  const prefix = usePrefix.usePrefix();
  const tooltipId = useId.useFallbackId(id);
  function onKeyDown(event) {
    if (isOpen && match.match(event, keys.Escape)) {
      event.stopPropagation();
      setOpen(false);
    }
  }
  return /*#__PURE__*/React__default["default"].createElement(index.Popover, {
    align: align,
    className: className,
    dropShadow: false,
    highContrast: true,
    onMouseLeave: () => {
      setOpen(false);
    },
    onMouseEnter: () => {
      openOnHover ? setOpen(true) : null;
    },
    open: isOpen
  }, /*#__PURE__*/React__default["default"].createElement("button", _rollupPluginBabelHelpers["extends"]({}, rest, {
    className: cx__default["default"](`${prefix}--definition-term`, triggerClassName),
    "aria-controls": tooltipId,
    "aria-expanded": isOpen,
    onBlur: () => {
      setOpen(false);
    },
    onClick: () => {
      setOpen(!isOpen);
    },
    onKeyDown: onKeyDown,
    type: "button"
  }), children), /*#__PURE__*/React__default["default"].createElement(index.PopoverContent, {
    className: `${prefix}--definition-tooltip`,
    id: tooltipId
  }, tooltipText ?? definition));
};
DefinitionTooltip.propTypes = {
  /**
   * Specify how the trigger should align with the tooltip
   */
  align: PropTypes__default["default"].oneOf(['top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top']),
  /**
   * The `children` prop will be used as the value that is being defined
   */
  children: PropTypes__default["default"].node.isRequired,
  /**
   * Specify an optional className to be applied to the container node
   */
  className: PropTypes__default["default"].string,
  /**
   * Specify whether the tooltip should be open when it first renders
   */
  defaultOpen: PropTypes__default["default"].bool,
  /**
   * The `definition` prop is used as the content inside of the tooltip that
   * appears when a user interacts with the element rendered by the `children`
   * prop
   */
  definition: PropTypes__default["default"].node.isRequired,
  /**
   * Provide a value that will be assigned as the id of the tooltip
   */
  id: PropTypes__default["default"].string,
  /**
   * Specifies whether or not the `DefinitionTooltip` should open on hover or not
   */
  openOnHover: PropTypes__default["default"].bool,
  /**
   * [Deprecated in v11] Please use the `definition` prop instead.
   *
   * Provide the text that will be displayed in the tooltip when it is rendered.
   */
  tooltipText: deprecate["default"](PropTypes__default["default"].node, 'The tooltipText prop has been deprecated. Please use the `definition` prop instead.'),
  /**
   * The CSS class name of the trigger element
   */
  triggerClassName: PropTypes__default["default"].string
};

exports.DefinitionTooltip = DefinitionTooltip;