Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
fix(DropdownMenu): Allow positionFixed prop to be passed through (#1538)
Allow the positionFixed prop to be passed through to the Popper component

Fixes #1473
  • Loading branch information
ccummings authored and TheSharpieOne committed Jul 9, 2019
1 parent e85238b commit 01466ae
Show file tree
Hide file tree
Showing 3 changed files with 18 additions and 2 deletions.
4 changes: 3 additions & 1 deletion docs/lib/Components/DropdownsPage.js
Expand Up @@ -94,7 +94,9 @@ DropdownMenu.propTypes = {
cssModule: PropTypes.object,
// Custom modifiers that are passed to DropdownMenu.js, see https://popper.js.org/popper-documentation.html#modifiers
modifiers: PropTypes.object,
persist: PropTypes.bool // presist the popper, even when closed. See #779 for reasoning
persist: PropTypes.bool, // presist the popper, even when closed. See #779 for reasoning
// passed to popper, see https://popper.js.org/popper-documentation.html#Popper.Defaults.positionFixed
positionFixed: PropTypes.bool
};
DropdownItem.propTypes = {
Expand Down
5 changes: 4 additions & 1 deletion src/DropdownMenu.js
Expand Up @@ -14,6 +14,7 @@ const propTypes = {
className: PropTypes.string,
cssModule: PropTypes.object,
persist: PropTypes.bool,
positionFixed: PropTypes.bool,
};

const defaultProps = {
Expand All @@ -33,7 +34,7 @@ const directionPositionMap = {
class DropdownMenu extends React.Component {

render() {
const { className, cssModule, right, tag, flip, modifiers, persist, ...attrs } = this.props;
const { className, cssModule, right, tag, flip, modifiers, persist, positionFixed, ...attrs } = this.props;
const classes = mapToCssModules(classNames(
className,
'dropdown-menu',
Expand All @@ -54,11 +55,13 @@ class DropdownMenu extends React.Component {
...modifiers,
...noFlipModifier,
} : modifiers;
const popperPositionFixed = !!positionFixed;

return (
<Popper
placement={poperPlacement}
modifiers={poperModifiers}
positionFixed={popperPositionFixed}
>
{({ ref, style, placement }) => (
<Tag
Expand Down
11 changes: 11 additions & 0 deletions src/__tests__/DropdownMenu.spec.js
Expand Up @@ -160,6 +160,17 @@ describe('DropdownMenu', () => {
expect(wrapper.find(Popper).prop('modifiers')).toEqual({ flip: { enabled: false } });
});

it('should position using fixed mode when positionFixed is true', () => {
isOpen = true;
const wrapper = mount(
<DropdownContext.Provider value={{ isOpen, direction, inNavbar }}>
<DropdownMenu positionFixed>Ello world</DropdownMenu>
</DropdownContext.Provider>
);

expect(wrapper.find(Popper).prop('positionFixed')).toBe(true);
});

it('should not render multiple children when isOpen is false', () => {
const wrapper = mount(
<DropdownContext.Provider value={{ isOpen, direction, inNavbar }}>
Expand Down

0 comments on commit 01466ae

Please sign in to comment.