123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127 |
- import _extends from "@babel/runtime/helpers/esm/extends";
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
- import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
- var _excluded = ["arrow", "prefixCls", "transitionName", "animation", "align", "placement", "placements", "getPopupContainer", "showAction", "hideAction", "overlayClassName", "overlayStyle", "visible", "trigger", "autoFocus", "overlay", "children", "onVisibleChange"];
- import Trigger from '@rc-component/trigger';
- import classNames from 'classnames';
- import { composeRef, getNodeRef, supportRef } from "rc-util/es/ref";
- import React from 'react';
- import useAccessibility from "./hooks/useAccessibility";
- import Overlay from "./Overlay";
- import Placements from "./placements";
- 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 : _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 = _objectWithoutProperties(props, _excluded);
- var _React$useState = React.useState(),
- _React$useState2 = _slicedToArray(_React$useState, 2),
- triggerVisible = _React$useState2[0],
- setTriggerVisible = _React$useState2[1];
- var mergedVisible = 'visible' in props ? visible : triggerVisible;
- var triggerRef = React.useRef(null);
- var overlayRef = React.useRef(null);
- var childRef = React.useRef(null);
- React.useImperativeHandle(ref, function () {
- return triggerRef.current;
- });
- var handleVisibleChange = function handleVisibleChange(newVisible) {
- setTriggerVisible(newVisible);
- onVisibleChange === null || onVisibleChange === void 0 || onVisibleChange(newVisible);
- };
- useAccessibility({
- 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.createElement(Overlay, {
- 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.cloneElement(children, {
- className: classNames((_children$props = children.props) === null || _children$props === void 0 ? void 0 : _children$props.className, mergedVisible && getOpenClassName()),
- ref: supportRef(children) ? composeRef(childRef, getNodeRef(children)) : undefined
- });
- var triggerHideAction = hideAction;
- if (!triggerHideAction && trigger.indexOf('contextMenu') !== -1) {
- triggerHideAction = ['click'];
- }
- return /*#__PURE__*/React.createElement(Trigger, _extends({
- builtinPlacements: placements
- }, otherProps, {
- prefixCls: prefixCls,
- ref: triggerRef,
- popupClassName: classNames(overlayClassName, _defineProperty({}, "".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);
- }
- export default /*#__PURE__*/React.forwardRef(Dropdown);
|