UNPKG

@boomerang-io/carbon-addons-boomerang-react

Version:
58 lines (51 loc) 2.06 kB
'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); var React = require('react'); var Tippy = require('@tippyjs/react'); var cx = require('classnames'); var settings = require('../../internal/settings.js'); function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; } var React__default = /*#__PURE__*/_interopDefault(React); var Tippy__default = /*#__PURE__*/_interopDefault(Tippy); var cx__default = /*#__PURE__*/_interopDefault(cx); /* IBM Confidential 694970X, 69497O0 © Copyright IBM Corp. 2022, 2024 */ /** * TooltipHover to replace TooltipDefintion in most situations. * Uses https://github.com/atomiks/tippyjs-react */ function TooltipHover({ align, direction, children, className, content, placement, tooltipContent, tooltipText, ...rest }) { // support all three for compat with both tippy props and carbon const contentToRender = content || tooltipContent || tooltipText; /** * Determine where to place it based on possible combinations * */ let computedPlacement = ""; // Tippy prop placement takes precedence if (placement) { computedPlacement = placement; } else { if (direction && align) { computedPlacement = `${direction}-${align}`; } else if (direction) { computedPlacement = direction; } else if (align) { computedPlacement = `auto-${align}`; } else { computedPlacement = "bottom"; } } // Sensible defaults to match CDS return (React__default.default.createElement(Tippy__default.default, { arrow: `<svg height="6px" width="8px" viewBox="0 0 80 60" xmlns="http://www.w3.org/2000/svg"> <polygon points= "0 60, 40 0, 80 60"/> </svg>`, animation: "fade", className: cx__default.default(`${settings.prefix}--bmrg-tooltip`, className), content: contentToRender, duration: 100, placement: computedPlacement, ...rest }, children)); } exports.default = TooltipHover;