"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');


var _chunkRSHN4K6Ncjs = require('./chunk-RSHN4K6N.cjs');



var _chunkZ6EUSUADcjs = require('./chunk-Z6EUSUAD.cjs');

// src/components/Tooltip.tsx
var _css = require('@emotion/css');
var _react = require('@emotion/react');
var _react3 = require('react'); var _react4 = _interopRequireDefault(_react3);
var _reactdom = require('react-dom'); var _reactdom2 = _interopRequireDefault(_reactdom);
var _reacttooltip = require('react-tooltip');
var _jsxruntime = require('@emotion/react/jsx-runtime');
function Tooltip(props) {
  const maxWidth = props.maxWidth || 260;
  const nodeRef = _react3.useRef.call(void 0, null);
  const [nodeReady, setNodeReady] = _react4.default.useState(false);
  _react3.useEffect.call(void 0, () => {
    if (!nodeRef.current) {
      nodeRef.current = document.createElement("div");
      document.body.appendChild(nodeRef.current);
    }
    setNodeReady(true);
    return () => {
      if (nodeRef.current) {
        document.body.removeChild(nodeRef.current);
        nodeRef.current = null;
      }
    };
  }, []);
  const theme = _react.useTheme.call(void 0, );
  return nodeReady && nodeRef.current ? _reactdom2.default.createPortal(
    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
      _reacttooltip.Tooltip,
      _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, props), {
        id: props.id || "",
        content: props.content || "",
        noArrow: true,
        border: "0.05rem solid rgba(0, 0, 0, 0.1)",
        className: styles({ theme, maxWidth }),
        variant: "light",
        clickable: Boolean(props.interactive)
      })
    ),
    nodeRef.current
  ) : null;
}
var styles = ({ theme, maxWidth }) => _css.css`
  font-size: "10px";
  color: ${theme.c8Neutral} !important;
  border-radius: 8px !important;
  padding: 16px !important;
  z-index: ${_chunkZU72XWNEcjs.z.tooltip};
  ${_chunkRSHN4K6Ncjs.overlaySurface.call(void 0, { theme, important: true })};

  max-width: ${maxWidth}px;
  word-break: break-word;
  box-shadow:
    0px 1px 4px 0px rgba(0, 0, 0, 0.1),
    0px 4px 8px 0px rgba(0, 0, 0, 0.08) !important;
`;



exports.Tooltip = Tooltip;
