135 lines
5.8 KiB
JavaScript
135 lines
5.8 KiB
JavaScript
|
"use strict";
|
||
|
|
||
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
||
|
Object.defineProperty(exports, "__esModule", {
|
||
|
value: true
|
||
|
});
|
||
|
exports.default = void 0;
|
||
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
||
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
||
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
||
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
||
|
var _trigger = _interopRequireDefault(require("@rc-component/trigger"));
|
||
|
var _classnames = _interopRequireDefault(require("classnames"));
|
||
|
var _ref = require("rc-util/lib/ref");
|
||
|
var _react = _interopRequireDefault(require("react"));
|
||
|
var _useAccessibility = _interopRequireDefault(require("./hooks/useAccessibility"));
|
||
|
var _Overlay = _interopRequireDefault(require("./Overlay"));
|
||
|
var _placements = _interopRequireDefault(require("./placements"));
|
||
|
var _excluded = ["arrow", "prefixCls", "transitionName", "animation", "align", "placement", "placements", "getPopupContainer", "showAction", "hideAction", "overlayClassName", "overlayStyle", "visible", "trigger", "autoFocus", "overlay", "children", "onVisibleChange"];
|
||
|
function Dropdown(props, ref) {
|
||
|
var _children$props;
|
||
|
var _props$arrow = props.arrow,
|
||
|
arrow = _props$arrow === void 0 ? false : _props$arrow,
|
||
|
_props$prefixCls = props.prefixCls,
|
||
|
prefixCls = _props$prefixCls === void 0 ? 'rc-dropdown' : _props$prefixCls,
|
||
|
transitionName = props.transitionName,
|
||
|
animation = props.animation,
|
||
|
align = props.align,
|
||
|
_props$placement = props.placement,
|
||
|
placement = _props$placement === void 0 ? 'bottomLeft' : _props$placement,
|
||
|
_props$placements = props.placements,
|
||
|
placements = _props$placements === void 0 ? _placements.default : _props$placements,
|
||
|
getPopupContainer = props.getPopupContainer,
|
||
|
showAction = props.showAction,
|
||
|
hideAction = props.hideAction,
|
||
|
overlayClassName = props.overlayClassName,
|
||
|
overlayStyle = props.overlayStyle,
|
||
|
visible = props.visible,
|
||
|
_props$trigger = props.trigger,
|
||
|
trigger = _props$trigger === void 0 ? ['hover'] : _props$trigger,
|
||
|
autoFocus = props.autoFocus,
|
||
|
overlay = props.overlay,
|
||
|
children = props.children,
|
||
|
onVisibleChange = props.onVisibleChange,
|
||
|
otherProps = (0, _objectWithoutProperties2.default)(props, _excluded);
|
||
|
var _React$useState = _react.default.useState(),
|
||
|
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
|
||
|
triggerVisible = _React$useState2[0],
|
||
|
setTriggerVisible = _React$useState2[1];
|
||
|
var mergedVisible = 'visible' in props ? visible : triggerVisible;
|
||
|
var triggerRef = _react.default.useRef(null);
|
||
|
var overlayRef = _react.default.useRef(null);
|
||
|
var childRef = _react.default.useRef(null);
|
||
|
_react.default.useImperativeHandle(ref, function () {
|
||
|
return triggerRef.current;
|
||
|
});
|
||
|
var handleVisibleChange = function handleVisibleChange(newVisible) {
|
||
|
setTriggerVisible(newVisible);
|
||
|
onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(newVisible);
|
||
|
};
|
||
|
(0, _useAccessibility.default)({
|
||
|
visible: mergedVisible,
|
||
|
triggerRef: childRef,
|
||
|
onVisibleChange: handleVisibleChange,
|
||
|
autoFocus: autoFocus,
|
||
|
overlayRef: overlayRef
|
||
|
});
|
||
|
var onClick = function onClick(e) {
|
||
|
var onOverlayClick = props.onOverlayClick;
|
||
|
setTriggerVisible(false);
|
||
|
if (onOverlayClick) {
|
||
|
onOverlayClick(e);
|
||
|
}
|
||
|
};
|
||
|
var getMenuElement = function getMenuElement() {
|
||
|
return /*#__PURE__*/_react.default.createElement(_Overlay.default, {
|
||
|
ref: overlayRef,
|
||
|
overlay: overlay,
|
||
|
prefixCls: prefixCls,
|
||
|
arrow: arrow
|
||
|
});
|
||
|
};
|
||
|
var getMenuElementOrLambda = function getMenuElementOrLambda() {
|
||
|
if (typeof overlay === 'function') {
|
||
|
return getMenuElement;
|
||
|
}
|
||
|
return getMenuElement();
|
||
|
};
|
||
|
var getMinOverlayWidthMatchTrigger = function getMinOverlayWidthMatchTrigger() {
|
||
|
var minOverlayWidthMatchTrigger = props.minOverlayWidthMatchTrigger,
|
||
|
alignPoint = props.alignPoint;
|
||
|
if ('minOverlayWidthMatchTrigger' in props) {
|
||
|
return minOverlayWidthMatchTrigger;
|
||
|
}
|
||
|
return !alignPoint;
|
||
|
};
|
||
|
var getOpenClassName = function getOpenClassName() {
|
||
|
var openClassName = props.openClassName;
|
||
|
if (openClassName !== undefined) {
|
||
|
return openClassName;
|
||
|
}
|
||
|
return "".concat(prefixCls, "-open");
|
||
|
};
|
||
|
var childrenNode = /*#__PURE__*/_react.default.cloneElement(children, {
|
||
|
className: (0, _classnames.default)((_children$props = children.props) === null || _children$props === void 0 ? void 0 : _children$props.className, mergedVisible && getOpenClassName()),
|
||
|
ref: (0, _ref.supportRef)(children) ? (0, _ref.composeRef)(childRef, children.ref) : undefined
|
||
|
});
|
||
|
var triggerHideAction = hideAction;
|
||
|
if (!triggerHideAction && trigger.indexOf('contextMenu') !== -1) {
|
||
|
triggerHideAction = ['click'];
|
||
|
}
|
||
|
return /*#__PURE__*/_react.default.createElement(_trigger.default, (0, _extends2.default)({
|
||
|
builtinPlacements: placements
|
||
|
}, otherProps, {
|
||
|
prefixCls: prefixCls,
|
||
|
ref: triggerRef,
|
||
|
popupClassName: (0, _classnames.default)(overlayClassName, (0, _defineProperty2.default)({}, "".concat(prefixCls, "-show-arrow"), arrow)),
|
||
|
popupStyle: overlayStyle,
|
||
|
action: trigger,
|
||
|
showAction: showAction,
|
||
|
hideAction: triggerHideAction,
|
||
|
popupPlacement: placement,
|
||
|
popupAlign: align,
|
||
|
popupTransitionName: transitionName,
|
||
|
popupAnimation: animation,
|
||
|
popupVisible: mergedVisible,
|
||
|
stretch: getMinOverlayWidthMatchTrigger() ? 'minWidth' : '',
|
||
|
popup: getMenuElementOrLambda(),
|
||
|
onPopupVisibleChange: handleVisibleChange,
|
||
|
onPopupClick: onClick,
|
||
|
getPopupContainer: getPopupContainer
|
||
|
}), childrenNode);
|
||
|
}
|
||
|
var _default = /*#__PURE__*/_react.default.forwardRef(Dropdown);
|
||
|
exports.default = _default;
|