@clayui/drop-down/lib/Menu.js

ClayDropDown component

"use strict";

function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.Align = void 0;
var _shared = require("@clayui/shared");
var _classnames = _interopRequireDefault(require("classnames"));
var _react = _interopRequireWildcard(require("react"));
var _excluded = ["active", "alignElementRef", "alignmentByViewport", "alignmentPosition", "autoBestAlign", "children", "className", "closeOnClickOutside", "containerProps", "deps", "hasLeftSymbols", "hasRightSymbols", "height", "lock", "offsetFn", "onActiveChange", "onSetActive", "role", "suppress", "triggerRef", "width"];
/**
 * SPDX-FileCopyrightText: © 2019 Liferay, Inc. <https://liferay.com>
 * SPDX-License-Identifier: BSD-3-Clause
 */
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) { if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } } return n.default = e, t && t.set(e, n), n; }
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) { ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } } return n; }, _extends.apply(null, arguments); }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) { o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } } return i; }
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) { if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } } return t; }
var Align = exports.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
};
var Menu = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
  var _classNames;
  var _ref$active = _ref.active,
    active = _ref$active === void 0 ? false : _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,
    _ref$deps = _ref.deps,
    deps = _ref$deps === void 0 ? [active, children] : _ref$deps,
    hasLeftSymbols = _ref.hasLeftSymbols,
    hasRightSymbols = _ref.hasRightSymbols,
    height = _ref.height,
    _ref$lock = _ref.lock,
    lock = _ref$lock === void 0 ? false : _ref$lock,
    offsetFn = _ref.offsetFn,
    onActiveChange = _ref.onActiveChange,
    onSetActive = _ref.onSetActive,
    _ref$role = _ref.role,
    role = _ref$role === void 0 ? 'presentation' : _ref$role,
    suppress = _ref.suppress,
    triggerRef = _ref.triggerRef,
    width = _ref.width,
    otherProps = _objectWithoutProperties(_ref, _excluded);
  var setActive = onActiveChange !== null && onActiveChange !== void 0 ? onActiveChange : onSetActive;
  var menuInternalRef = (0, _react.useRef)(null);
  var subPortalRef = (0, _react.useRef)(null);
  var menuRef = menuInternalRef;
  if (ref) {
    menuRef = ref;
  }
  (0, _shared.useOverlayPosition)({
    alignmentByViewport: alignmentByViewport,
    alignmentPosition: alignmentPosition,
    autoBestAlign: autoBestAlign,
    getOffset: offsetFn,
    isOpen: active,
    ref: menuRef,
    triggerRef: alignElementRef
  }, deps);
  return /*#__PURE__*/_react.default.createElement(_shared.Overlay, {
    isCloseOnInteractOutside: closeOnClickOutside,
    isKeyboardDismiss: true,
    isModal: lock,
    isOpen: active,
    menuRef: menuRef,
    onClose: function onClose() {
      return setActive(false);
    },
    portalRef: subPortalRef,
    suppress: suppress,
    triggerRef: triggerRef !== null && triggerRef !== void 0 ? triggerRef : alignElementRef
  }, /*#__PURE__*/_react.default.createElement("div", _extends({}, containerProps, {
    ref: subPortalRef
  }), /*#__PURE__*/_react.default.createElement("div", _extends({}, otherProps, {
    "aria-hidden": !active ? true : undefined,
    "aria-modal": lock ? true : undefined,
    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: menuRef,
    role: role
  }), children)));
});
Menu.displayName = 'ClayDropDownMenu';
var _default = exports.default = Menu;