"use strict";

Liferay.Loader.define("@frontend-taglib-clay$clayui/drop-down@3.58.0/lib/Menu", ['module', 'exports', 'require', '@frontend-taglib-clay$clayui/shared', 'frontend-taglib-clay$classnames', 'frontend-js-react-web$react'], function (module, exports, require) {
  var define = undefined;
  var global = window;
  {
    function _typeof(obj) {
      "@babel/helpers - typeof";
      if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
        _typeof = function _typeof(obj) {
          return typeof obj;
        };
      } else {
        _typeof = function _typeof(obj) {
          return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
        };
      }return _typeof(obj);
    }

    Object.defineProperty(exports, "__esModule", {
      value: true
    });
    exports.default = exports.Align = void 0;

    var _shared = require("@frontend-taglib-clay$clayui/shared");

    var _classnames = _interopRequireDefault(require("frontend-taglib-clay$classnames"));

    var _react = _interopRequireWildcard(require("frontend-js-react-web$react"));

    var _excluded = ["active", "alignElementRef", "alignmentByViewport", "alignmentPosition", "autoBestAlign", "children", "className", "closeOnClickOutside", "containerProps", "hasLeftSymbols", "hasRightSymbols", "height", "focusRefOnEsc", "offsetFn", "onActiveChange", "onSetActive", "width"];

    function _getRequireWildcardCache(nodeInterop) {
      if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {
        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
      })(nodeInterop);
    }

    function _interopRequireWildcard(obj, nodeInterop) {
      if (!nodeInterop && obj && obj.__esModule) {
        return obj;
      }if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") {
        return { default: obj };
      }var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {
        return cache.get(obj);
      }var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {
        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
          var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {
            Object.defineProperty(newObj, key, desc);
          } else {
            newObj[key] = obj[key];
          }
        }
      }newObj.default = obj;if (cache) {
        cache.set(obj, newObj);
      }return newObj;
    }

    function _interopRequireDefault(obj) {
      return obj && obj.__esModule ? obj : { default: obj };
    }

    function _extends() {
      _extends = Object.assign || function (target) {
        for (var i = 1; i < arguments.length; i++) {
          var source = arguments[i];for (var key in source) {
            if (Object.prototype.hasOwnProperty.call(source, key)) {
              target[key] = source[key];
            }
          }
        }return target;
      };return _extends.apply(this, arguments);
    }

    function _defineProperty(obj, key, value) {
      if (key in obj) {
        Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true });
      } else {
        obj[key] = value;
      }return obj;
    }

    function _objectWithoutProperties(source, excluded) {
      if (source == null) return {};var target = _objectWithoutPropertiesLoose(source, excluded);var key, i;if (Object.getOwnPropertySymbols) {
        var sourceSymbolKeys = Object.getOwnPropertySymbols(source);for (i = 0; i < sourceSymbolKeys.length; i++) {
          key = sourceSymbolKeys[i];if (excluded.indexOf(key) >= 0) continue;if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;target[key] = source[key];
        }
      }return target;
    }

    function _objectWithoutPropertiesLoose(source, excluded) {
      if (source == null) return {};var target = {};var sourceKeys = Object.keys(source);var key, i;for (i = 0; i < sourceKeys.length; i++) {
        key = sourceKeys[i];if (excluded.indexOf(key) >= 0) continue;target[key] = source[key];
      }return target;
    }

    var Align = {
      BottomCenter: 4,
      BottomLeft: 5,
      BottomRight: 3,
      LeftBottom: 11,
      LeftCenter: 6,
      LeftTop: 10,
      RightBottom: 9,
      RightCenter: 2,
      RightTop: 8,
      TopCenter: 0,
      TopLeft: 7,
      TopRight: 1
    };
    exports.Align = Align;
    var ALIGN_INVERSE = {
      0: 'TopCenter',
      1: 'TopRight',
      2: 'RightCenter',
      3: 'BottomRight',
      4: 'BottomCenter',
      5: 'BottomLeft',
      6: 'LeftCenter',
      7: 'TopLeft',
      8: 'RightTop',
      9: 'RightBottom',
      10: 'LeftTop',
      11: 'LeftBottom'
    };
    var ALIGN_MAP = {
      BottomCenter: ['tc', 'bc'],
      BottomLeft: ['tl', 'bl'],
      BottomRight: ['tr', 'br'],
      LeftBottom: ['br', 'bl'],
      LeftCenter: ['cr', 'cl'],
      LeftTop: ['tr', 'tl'],
      RightBottom: ['bl', 'br'],
      RightCenter: ['cl', 'cr'],
      RightTop: ['tl', 'tr'],
      TopCenter: ['bc', 'tc'],
      TopLeft: ['bl', 'tl'],
      TopRight: ['br', 'tr']
    };

    /**
     * For backwards compatability, we are creating a util here so that `metal-position`
     * number values are used in the same manner and result in the same alignment direction.
     */
    var getAlignPoints = function getAlignPoints(val) {
      return ALIGN_MAP[ALIGN_INVERSE[val]];
    };

    var BOTTOM_OFFSET = [0, 4];
    var LEFT_OFFSET = [-4, 0];
    var RIGHT_OFFSET = [4, 0];
    var TOP_OFFSET = [0, -4];
    var OFFSET_MAP = {
      bctc: TOP_OFFSET,
      blbr: RIGHT_OFFSET,
      bltl: TOP_OFFSET,
      brbl: LEFT_OFFSET,
      brtr: TOP_OFFSET,
      clcr: RIGHT_OFFSET,
      crcl: LEFT_OFFSET,
      tcbc: BOTTOM_OFFSET,
      tlbl: BOTTOM_OFFSET,
      tltr: RIGHT_OFFSET,
      trbr: BOTTOM_OFFSET,
      trtl: LEFT_OFFSET
    };
    var useIsomorphicLayoutEffect = typeof window === 'undefined' ? _react.useEffect : _react.useLayoutEffect;

    var ClayDropDownMenu = /*#__PURE__*/_react.default.forwardRef(function (_ref, // TS + refs don't always play nicely together, which is why it is casted
    // in so many places below.
    // See https://github.com/microsoft/TypeScript/issues/30748#issuecomment-480197036
    ref) {
      var _classNames;

      var active = _ref.active,
          alignElementRef = _ref.alignElementRef,
          _ref$alignmentByViewp = _ref.alignmentByViewport,
          alignmentByViewport = _ref$alignmentByViewp === void 0 ? false : _ref$alignmentByViewp,
          _ref$alignmentPositio = _ref.alignmentPosition,
          alignmentPosition = _ref$alignmentPositio === void 0 ? Align.BottomLeft : _ref$alignmentPositio,
          _ref$autoBestAlign = _ref.autoBestAlign,
          autoBestAlign = _ref$autoBestAlign === void 0 ? true : _ref$autoBestAlign,
          children = _ref.children,
          className = _ref.className,
          _ref$closeOnClickOuts = _ref.closeOnClickOutside,
          closeOnClickOutside = _ref$closeOnClickOuts === void 0 ? true : _ref$closeOnClickOuts,
          _ref$containerProps = _ref.containerProps,
          containerProps = _ref$containerProps === void 0 ? {} : _ref$containerProps,
          hasLeftSymbols = _ref.hasLeftSymbols,
          hasRightSymbols = _ref.hasRightSymbols,
          height = _ref.height,
          focusRefOnEsc = _ref.focusRefOnEsc,
          _ref$offsetFn = _ref.offsetFn,
          offsetFn = _ref$offsetFn === void 0 ? function (points) {
        return OFFSET_MAP[points.join('')];
      } : _ref$offsetFn,
          onActiveChange = _ref.onActiveChange,
          onSetActive = _ref.onSetActive,
          width = _ref.width,
          otherProps = _objectWithoutProperties(_ref, _excluded);

      var setActive = onActiveChange !== null && onActiveChange !== void 0 ? onActiveChange : onSetActive;
      var subPortalRef = (0, _react.useRef)(null);
      (0, _react.useEffect)(function () {
        if (closeOnClickOutside) {
          var handleClick = function handleClick(event) {
            var nodeRefs = [alignElementRef, subPortalRef];
            var nodes = (Array.isArray(nodeRefs) ? nodeRefs : [nodeRefs]).filter(function (ref) {
              return ref.current;
            }).map(function (ref) {
              return ref.current;
            });

            if (event.target instanceof Node && !nodes.find(function (element) {
              return element.contains(event.target);
            })) {
              setActive(false);
            }
          };

          window.addEventListener('mousedown', handleClick);
          return function () {
            window.removeEventListener('mousedown', handleClick);
          };
        }
      }, [closeOnClickOutside]);
      (0, _react.useEffect)(function () {
        var handleEsc = function handleEsc(event) {
          if (event.key === _shared.Keys.Esc) {
            event.stopImmediatePropagation();

            if (focusRefOnEsc && focusRefOnEsc.current) {
              focusRefOnEsc.current.focus();
            }

            setActive(false);
          }
        };

        if (active) {
          document.addEventListener('keyup', handleEsc, true);
        }

        return function () {
          document.removeEventListener('keyup', handleEsc, true);
        };
      }, [active]);

      var align = function align() {
        if (alignElementRef && alignElementRef.current) {
          var _points = alignmentPosition;

          if (typeof _points === 'number') {
            _points = getAlignPoints(_points);
          }

          if (ref.current) {
            (0, _shared.doAlign)({
              offset: offsetFn(_points),
              overflow: {
                adjustX: autoBestAlign,
                adjustY: autoBestAlign,
                alwaysByViewport: alignmentByViewport
              },
              points: _points,
              sourceElement: ref.current,
              targetElement: alignElementRef.current
            });
          }
        }
      };

      useIsomorphicLayoutEffect(function () {
        if (active) {
          align();
        }
      }, [active]);
      (0, _react.useEffect)(function () {
        if (alignElementRef && alignElementRef.current) {
          var unobserve = (0, _shared.observeRect)(alignElementRef.current, align);
          return unobserve;
        }
      }, []);
      return (/*#__PURE__*/_react.default.createElement(_shared.ClayPortal, _extends({}, containerProps, {
          subPortalRef: subPortalRef
        }), /*#__PURE__*/_react.default.createElement("div", {
          ref: subPortalRef
        }, /*#__PURE__*/_react.default.createElement("div", _extends({}, otherProps, {
          className: (0, _classnames.default)('dropdown-menu', className, (_classNames = {
            'dropdown-menu-indicator-end': hasRightSymbols,
            'dropdown-menu-indicator-start': hasLeftSymbols
          }, _defineProperty(_classNames, "dropdown-menu-height-".concat(height), height), _defineProperty(_classNames, "dropdown-menu-width-".concat(width), width), _defineProperty(_classNames, "show", active), _classNames)),
          ref: ref
        }), children)))
      );
    });

    ClayDropDownMenu.displayName = 'ClayDropDownMenu';
    var _default = ClayDropDownMenu;
    exports.default = _default;
  }
});
//# sourceMappingURL=Menu.js.map