import './Tooltip_1mkjdyq.css';
import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
import React__default, { forwardRef, useState, useEffect } from 'react';
import { styled } from '@linaria/react';
import { cx } from '../../utils/index.js';
import { TooltipRoot, StyledContentLeft } from './Tooltip.styles.js';
import { base } from './variations/_view/base.js';
import { base as base$1 } from './variations/_size/base.js';
import { useDelayedTooltip } from './hooks/useDelayedTooltip.js';
import { component } from '../../engines/common.js';
import { popoverConfig } from '../Popover/Popover.js';

var _excluded = ["id", "text", "opened", "isVisible", "isOpen", "hasArrow", "arrow", "animated", "offset", "minWidth", "maxWidth", "placement", "usePortal", "target", "children", "onDismiss", "view", "size", "contentLeft", "zIndex", "className", "style", "hoverTimeout", "mouseEnterDelay", "mouseLeaveDelay", "trigger"];
var ESCAPE_KEYCODE = 27;
var getStringValue = function getStringValue(value) {
  return typeof value === 'number' ? "".concat(value, "rem") : value;
};
var Popover = /*#__PURE__*/component(popoverConfig);
var _exp = function _exp() {
  return Popover;
};
var StyledPopover = /*#__PURE__*/styled(_exp())({
  name: "StyledPopover",
  "class": "swn233w",
  propsAsIs: true
});

/**
 * Компонент для текстовых подсказок. Основное предназначение — подписи к блокам.
 */

var tooltipRoot = function tooltipRoot(Root) {
  return /*#__PURE__*/forwardRef(function (_ref, outerRef) {
    var _ref2, _mouseLeaveDelay;
    var id = _ref.id,
      text = _ref.text,
      opened = _ref.opened,
      isVisible = _ref.isVisible,
      isOpen = _ref.isOpen,
      _ref$hasArrow = _ref.hasArrow,
      hasArrow = _ref$hasArrow === void 0 ? true : _ref$hasArrow,
      arrow = _ref.arrow,
      animated = _ref.animated,
      _ref$offset = _ref.offset,
      offset = _ref$offset === void 0 ? [3, 8] : _ref$offset,
      minWidth = _ref.minWidth,
      maxWidth = _ref.maxWidth,
      _ref$placement = _ref.placement,
      placement = _ref$placement === void 0 ? 'bottom' : _ref$placement,
      _ref$usePortal = _ref.usePortal,
      usePortal = _ref$usePortal === void 0 ? true : _ref$usePortal,
      target = _ref.target,
      children = _ref.children,
      onDismiss = _ref.onDismiss,
      view = _ref.view,
      size = _ref.size,
      contentLeft = _ref.contentLeft,
      _ref$zIndex = _ref.zIndex,
      zIndex = _ref$zIndex === void 0 ? '9200' : _ref$zIndex,
      className = _ref.className,
      style = _ref.style,
      hoverTimeout = _ref.hoverTimeout,
      _ref$mouseEnterDelay = _ref.mouseEnterDelay,
      mouseEnterDelay = _ref$mouseEnterDelay === void 0 ? 0 : _ref$mouseEnterDelay,
      mouseLeaveDelay = _ref.mouseLeaveDelay,
      trigger = _ref.trigger,
      rest = _objectWithoutProperties(_ref, _excluded);
    var _useState = useState(null),
      _useState2 = _slicedToArray(_useState, 2),
      ref = _useState2[0],
      setRef = _useState2[1];
    mouseLeaveDelay = (_ref2 = (_mouseLeaveDelay = mouseLeaveDelay) !== null && _mouseLeaveDelay !== void 0 ? _mouseLeaveDelay : hoverTimeout) !== null && _ref2 !== void 0 ? _ref2 : 300;
    var _useDelayedTooltip = useDelayedTooltip(mouseEnterDelay, mouseLeaveDelay),
      openedState = _useDelayedTooltip.opened,
      showTooltip = _useDelayedTooltip.showTooltip,
      hideTooltip = _useDelayedTooltip.hideTooltip,
      setOpened = _useDelayedTooltip.setOpened;
    var isTooltipOpened = Boolean(text) && (isVisible || isOpen || opened || openedState);
    useEffect(function () {
      var onKeyDown = function onKeyDown(event) {
        if (event.keyCode === ESCAPE_KEYCODE) {
          onDismiss === null || onDismiss === void 0 || onDismiss();
        }
      };
      window.addEventListener('keydown', onKeyDown);
      return function () {
        window.removeEventListener('keydown', onKeyDown);
      };
    }, []);
    var onToggle = function onToggle(isOpen) {
      if (trigger === 'hover') {
        if (isOpen) {
          showTooltip();
        } else {
          hideTooltip();
        }
      } else {
        setOpened(isOpen);
      }
    };
    return /*#__PURE__*/React__default.createElement(StyledPopover, _extends({
      opened: isTooltipOpened,
      placement: placement,
      offset: offset,
      zIndex: zIndex,
      target: target || children,
      usePortal: usePortal,
      hasArrow: arrow || hasArrow,
      "aria-hidden": !isTooltipOpened,
      "aria-live": "polite",
      role: "tooltip",
      animated: animated,
      className: cx(ref === null || ref === void 0 ? void 0 : ref.classList.toString())
    }, (trigger === 'hover' || trigger === 'click') && {
      trigger: trigger,
      onToggle: onToggle
    }, rest), /*#__PURE__*/React__default.createElement(Root, {
      view: view,
      size: size,
      ref: setRef,
      className: className,
      style: style
    }, /*#__PURE__*/React__default.createElement(TooltipRoot, {
      ref: outerRef,
      id: id,
      maxWidth: getStringValue(maxWidth),
      minWidth: getStringValue(minWidth)
    }, contentLeft && /*#__PURE__*/React__default.createElement(StyledContentLeft, null, contentLeft), text)));
  });
};
var tooltipConfig = {
  name: 'Tooltip',
  tag: 'div',
  layout: tooltipRoot,
  base: '',
  variations: {
    view: {
      css: base
    },
    size: {
      css: base$1
    }
  },
  defaults: {
    view: 'default',
    size: 'm'
  }
};

export { tooltipConfig, tooltipRoot };
