diff --git a/src/DropdownMenu.js b/src/DropdownMenu.js index fd8b1ac7..1cf42efb 100644 --- a/src/DropdownMenu.js +++ b/src/DropdownMenu.js @@ -40,6 +40,7 @@ export function useDropdownMenu(options = {}) { else if (drop === 'left') placement = alignEnd ? 'left-end' : 'left-start'; const popper = usePopper(toggleElement, menuElement, { + ...popperConfig, placement, enabled: !!(shouldUsePopper && show), eventsEnabled: !!show, diff --git a/src/usePopper.js b/src/usePopper.js index 9530cda9..c67fe2d7 100644 --- a/src/usePopper.js +++ b/src/usePopper.js @@ -22,18 +22,22 @@ const initialArrowStyles = {}; * @param {String} options.placement The popper element placement relative to the reference element * @param {Boolean} options.positionFixed use fixed positioning * @param {Boolean} options.eventsEnabled have Popper listen on window resize events to reposition the element + * @param {Function} options.onCreate called when the popper is created + * @param {Function} options.onUpdate called when the popper is updated */ export default function usePopper( referenceElement, popperElement, - { + options = {}, +) { + const { enabled = true, placement = 'bottom', positionFixed = false, eventsEnabled = true, modifiers = {}, - } = {}, -) { + } = options; + const popperInstanceRef = useRef(); const hasArrow = !!(modifiers.arrow && modifiers.arrow.element); @@ -81,6 +85,7 @@ export default function usePopper( }; popperInstanceRef.current = new PopperJS(referenceElement, popperElement, { + ...options, placement, positionFixed, modifiers: {