UNPKG

antd

Version:

An enterprise-class UI design language and React components implementation

122 lines (105 loc) 4.81 kB
import _extends from "@babel/runtime/helpers/esm/extends"; import _defineProperty from "@babel/runtime/helpers/esm/defineProperty"; import * as React from 'react'; import RcDropdown from 'rc-dropdown'; import classNames from 'classnames'; import RightOutlined from "@ant-design/icons/es/icons/RightOutlined"; import DropdownButton from './dropdown-button'; import { ConfigContext } from '../config-provider'; import devWarning from '../_util/devWarning'; import { tuple } from '../_util/type'; import { cloneElement } from '../_util/reactNode'; var Placements = tuple('topLeft', 'topCenter', 'topRight', 'bottomLeft', 'bottomCenter', 'bottomRight'); var Dropdown = function Dropdown(props) { var _React$useContext = React.useContext(ConfigContext), getContextPopupContainer = _React$useContext.getPopupContainer, getPrefixCls = _React$useContext.getPrefixCls, direction = _React$useContext.direction; var getTransitionName = function getTransitionName() { var rootPrefixCls = getPrefixCls(); var _props$placement = props.placement, placement = _props$placement === void 0 ? '' : _props$placement, transitionName = props.transitionName; if (transitionName !== undefined) { return transitionName; } if (placement.indexOf('top') >= 0) { return "".concat(rootPrefixCls, "-slide-down"); } return "".concat(rootPrefixCls, "-slide-up"); }; var renderOverlay = function renderOverlay(prefixCls) { // rc-dropdown already can process the function of overlay, but we have check logic here. // So we need render the element to check and pass back to rc-dropdown. var overlay = props.overlay; var overlayNode; if (typeof overlay === 'function') { overlayNode = overlay(); } else { overlayNode = overlay; } overlayNode = React.Children.only(typeof overlayNode === 'string' ? /*#__PURE__*/React.createElement("span", null, overlayNode) : overlayNode); var overlayProps = overlayNode.props; // Warning if use other mode devWarning(!overlayProps.mode || overlayProps.mode === 'vertical', 'Dropdown', "mode=\"".concat(overlayProps.mode, "\" is not supported for Dropdown's Menu.")); // menu cannot be selectable in dropdown defaultly var _overlayProps$selecta = overlayProps.selectable, selectable = _overlayProps$selecta === void 0 ? false : _overlayProps$selecta, expandIcon = overlayProps.expandIcon; var overlayNodeExpandIcon = typeof expandIcon !== 'undefined' && /*#__PURE__*/React.isValidElement(expandIcon) ? expandIcon : /*#__PURE__*/React.createElement("span", { className: "".concat(prefixCls, "-menu-submenu-arrow") }, /*#__PURE__*/React.createElement(RightOutlined, { className: "".concat(prefixCls, "-menu-submenu-arrow-icon") })); var fixedModeOverlay = typeof overlayNode.type === 'string' ? overlayNode : cloneElement(overlayNode, { mode: 'vertical', selectable: selectable, expandIcon: overlayNodeExpandIcon }); return fixedModeOverlay; }; var getPlacement = function getPlacement() { var placement = props.placement; if (placement !== undefined) { return placement; } return direction === 'rtl' ? 'bottomRight' : 'bottomLeft'; }; var arrow = props.arrow, customizePrefixCls = props.prefixCls, children = props.children, trigger = props.trigger, disabled = props.disabled, getPopupContainer = props.getPopupContainer, overlayClassName = props.overlayClassName; var prefixCls = getPrefixCls('dropdown', customizePrefixCls); var child = React.Children.only(children); var dropdownTrigger = cloneElement(child, { className: classNames("".concat(prefixCls, "-trigger"), _defineProperty({}, "".concat(prefixCls, "-rtl"), direction === 'rtl'), child.props.className), disabled: disabled }); var overlayClassNameCustomized = classNames(overlayClassName, _defineProperty({}, "".concat(prefixCls, "-rtl"), direction === 'rtl')); var triggerActions = disabled ? [] : trigger; var alignPoint; if (triggerActions && triggerActions.indexOf('contextMenu') !== -1) { alignPoint = true; } return /*#__PURE__*/React.createElement(RcDropdown, _extends({ arrow: arrow, alignPoint: alignPoint }, props, { overlayClassName: overlayClassNameCustomized, prefixCls: prefixCls, getPopupContainer: getPopupContainer || getContextPopupContainer, transitionName: getTransitionName(), trigger: triggerActions, overlay: function overlay() { return renderOverlay(prefixCls); }, placement: getPlacement() }), dropdownTrigger); }; Dropdown.Button = DropdownButton; Dropdown.defaultProps = { mouseEnterDelay: 0.15, mouseLeaveDelay: 0.1 }; export default Dropdown;