import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
import { popperCSSVars } from '@chakra-ui/popper';
import { Portal } from '@chakra-ui/portal';
import { chakra, forwardRef, useStyleConfig, omitThemingProps, useTheme, getCSSVar } from '@chakra-ui/system';
import { omit, pick } from '@chakra-ui/object-utils';
import { motion, AnimatePresence } from 'framer-motion';
import { Children, cloneElement } from 'react';
import { scale } from './chakraTooltip.transition.js';
import { useTooltip } from '@chakra-ui/react';

var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
var __objRest = (source, exclude) => {
  var target = {};
  for (var prop in source)
    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
      target[prop] = source[prop];
  if (source != null && __getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(source)) {
      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
        target[prop] = source[prop];
    }
  return target;
};
const MotionDiv = chakra(motion.div);
const ChakraTooltip = forwardRef((props, ref) => {
  var _b, _c;
  const styles = useStyleConfig("Tooltip", props);
  const ownProps = omitThemingProps(props);
  const theme = useTheme();
  const _a = ownProps, {
    children,
    label,
    shouldWrapChildren,
    "aria-label": ariaLabel,
    hasArrow,
    bg,
    portalProps,
    background,
    backgroundColor,
    bgColor,
    motionProps
  } = _a, rest = __objRest(_a, [
    "children",
    "label",
    "shouldWrapChildren",
    "aria-label",
    "hasArrow",
    "bg",
    "portalProps",
    "background",
    "backgroundColor",
    "bgColor",
    "motionProps"
  ]);
  const userDefinedBg = (_c = (_b = background != null ? background : backgroundColor) != null ? _b : bg) != null ? _c : bgColor;
  if (userDefinedBg) {
    styles.bg = userDefinedBg;
    const bgVar = getCSSVar(theme, "colors", userDefinedBg);
    styles[popperCSSVars.arrowBg.var] = bgVar;
  }
  const tooltip = useTooltip(__spreadProps(__spreadValues({}, rest), { direction: theme.direction }));
  const shouldWrap = typeof children === "string" || shouldWrapChildren;
  let trigger;
  if (shouldWrap) {
    trigger = /* @__PURE__ */ jsx(chakra.span, __spreadProps(__spreadValues({ display: "inline-block", tabIndex: 0 }, tooltip.getTriggerProps()), { children }));
  } else {
    const child = Children.only(children);
    trigger = cloneElement(child, tooltip.getTriggerProps(child.props, child.ref));
  }
  const hasAriaLabel = !!ariaLabel;
  const _tooltipProps = tooltip.getTooltipProps({}, ref);
  const tooltipProps = hasAriaLabel ? omit(_tooltipProps, ["role", "id"]) : _tooltipProps;
  const srOnlyProps = pick(_tooltipProps, ["role", "id"]);
  if (!label) {
    return /* @__PURE__ */ jsx(Fragment, { children });
  }
  const arrowStyles = {
    mt: props.placement === "top" ? "2.4px" : void 0,
    borderRight: props.placement === "top" ? "2px solid" : void 0,
    borderColor: props.placement === "top" ? "darkblue.600 !important" : void 0,
    // Needs !important to override PopperJS
    borderBottom: props.placement === "top" ? "2px solid" : void 0,
    boxShadow: props.placement === "top" ? "3px 1px 0px 0px var(--chakra-colors-gray-200) !important" : void 0
    // Needs !important to override PopperJS
  };
  return /* @__PURE__ */ jsxs(Fragment, { children: [
    trigger,
    /* @__PURE__ */ jsx(AnimatePresence, { children: tooltip.isOpen && /* @__PURE__ */ jsx(Portal, __spreadProps(__spreadValues({}, portalProps), { children: /* @__PURE__ */ jsx(
      chakra.div,
      __spreadProps(__spreadValues({}, tooltip.getTooltipPositionerProps()), {
        __css: {
          zIndex: styles.zIndex,
          pointerEvents: "none"
        },
        children: /* @__PURE__ */ jsxs(
          MotionDiv,
          __spreadProps(__spreadValues(__spreadValues({
            variants: scale,
            initial: "exit",
            animate: "enter",
            exit: "exit"
          }, motionProps), tooltipProps), {
            __css: styles,
            children: [
              label,
              hasAriaLabel && /* @__PURE__ */ jsx(chakra.span, __spreadProps(__spreadValues({ srOnly: true }, srOnlyProps), { children: ariaLabel })),
              hasArrow && /* @__PURE__ */ jsx(chakra.div, { "data-popper-arrow": true, className: "chakra-tooltip__arrow-wrapper", children: /* @__PURE__ */ jsx(
                chakra.div,
                __spreadProps(__spreadValues({
                  "data-popper-arrow-inner": true,
                  className: "chakra-tooltip__arrow"
                }, arrowStyles), {
                  __css: { bg: styles.bg }
                })
              ) })
            ]
          })
        )
      })
    ) })) })
  ] });
});
ChakraTooltip.displayName = "Tooltip";

export { ChakraTooltip };
//# sourceMappingURL=ChakraTooltip.js.map
