您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符
 
 
 
 

78 行
3.0 KiB

  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
  3. import classNames from 'classnames';
  4. import React, { useContext } from 'react';
  5. import { useDropdownMenu } from 'react-overlays/DropdownMenu';
  6. import useMergedRefs from '@restart/hooks/useMergedRefs';
  7. import NavbarContext from './NavbarContext';
  8. import { useBootstrapPrefix } from './ThemeProvider';
  9. import useWrappedRefWithWarning from './useWrappedRefWithWarning';
  10. import usePopperMarginModifiers from './usePopperMarginModifiers';
  11. var defaultProps = {
  12. alignRight: false,
  13. flip: true
  14. };
  15. var DropdownMenu = React.forwardRef(function (_ref, ref) {
  16. var bsPrefix = _ref.bsPrefix,
  17. className = _ref.className,
  18. alignRight = _ref.alignRight,
  19. rootCloseEvent = _ref.rootCloseEvent,
  20. flip = _ref.flip,
  21. showProps = _ref.show,
  22. renderOnMount = _ref.renderOnMount,
  23. _ref$as = _ref.as,
  24. Component = _ref$as === void 0 ? 'div' : _ref$as,
  25. _ref$popperConfig = _ref.popperConfig,
  26. popperConfig = _ref$popperConfig === void 0 ? {} : _ref$popperConfig,
  27. props = _objectWithoutPropertiesLoose(_ref, ["bsPrefix", "className", "alignRight", "rootCloseEvent", "flip", "show", "renderOnMount", "as", "popperConfig"]);
  28. var isNavbar = useContext(NavbarContext);
  29. var prefix = useBootstrapPrefix(bsPrefix, 'dropdown-menu');
  30. var _usePopperMarginModif = usePopperMarginModifiers(),
  31. popperRef = _usePopperMarginModif[0],
  32. marginModifiers = _usePopperMarginModif[1];
  33. var _useDropdownMenu = useDropdownMenu({
  34. flip: flip,
  35. rootCloseEvent: rootCloseEvent,
  36. show: showProps,
  37. alignEnd: alignRight,
  38. usePopper: !isNavbar,
  39. popperConfig: _extends({}, popperConfig, {
  40. modifiers: marginModifiers.concat(popperConfig.modifiers || [])
  41. })
  42. }),
  43. hasShown = _useDropdownMenu.hasShown,
  44. placement = _useDropdownMenu.placement,
  45. show = _useDropdownMenu.show,
  46. alignEnd = _useDropdownMenu.alignEnd,
  47. close = _useDropdownMenu.close,
  48. menuProps = _useDropdownMenu.props;
  49. menuProps.ref = useMergedRefs(popperRef, useMergedRefs(useWrappedRefWithWarning(ref, 'DropdownMenu'), menuProps.ref));
  50. if (!hasShown && !renderOnMount) return null; // For custom components provide additional, non-DOM, props;
  51. if (typeof Component !== 'string') {
  52. menuProps.show = show;
  53. menuProps.close = close;
  54. menuProps.alignRight = alignEnd;
  55. }
  56. var style = props.style;
  57. if (placement) {
  58. // we don't need the default popper style,
  59. // menus are display: none when not shown.
  60. style = _extends({}, style, {}, menuProps.style);
  61. props['x-placement'] = placement;
  62. }
  63. return /*#__PURE__*/React.createElement(Component, _extends({}, props, menuProps, {
  64. style: style,
  65. className: classNames(className, prefix, show && 'show', alignEnd && prefix + "-right")
  66. }));
  67. });
  68. DropdownMenu.displayName = 'DropdownMenu';
  69. DropdownMenu.defaultProps = defaultProps;
  70. export default DropdownMenu;