Skip to content

Commit

Permalink
Update MenuPlacer context usage to the new context API
Browse files Browse the repository at this point in the history
This solves #3916, and partially addresses #3703.
From React 16.3 the old Context API was deprecated and
it's rising warnings when runng in strict-mode.
  • Loading branch information
dpordomingo committed Feb 11, 2020
1 parent 1c002f0 commit d284f40
Showing 1 changed file with 10 additions and 13 deletions.
23 changes: 10 additions & 13 deletions packages/react-select/src/components/Menu.js
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
// @flow
/** @jsx jsx */
import {
createContext,
Component,
type Element as ReactElement,
type ElementRef,
type Node,
} from 'react';
import { jsx } from '@emotion/core';
import { createPortal } from 'react-dom';
import PropTypes from 'prop-types';

import {
animatedScrollTo,
Expand Down Expand Up @@ -258,15 +258,16 @@ export const menuCSS = ({
zIndex: 1,
});

const PortalPlacementContext = createContext<() => void>(() => { });

// NOTE: internal only
export class MenuPlacer extends Component<MenuPlacerProps, MenuState> {
state = {
maxHeight: this.props.maxMenuHeight,
placement: null,
};
static contextTypes = {
getPortalPlacement: PropTypes.func,
};
static contextType = PortalPlacementContext;

getPlacement = (ref: ElementRef<*>) => {
const {
minMenuHeight,
Expand Down Expand Up @@ -481,14 +482,6 @@ export const menuPortalCSS = ({ rect, offset, position }: PortalStyleArgs) => ({

export class MenuPortal extends Component<MenuPortalProps, MenuPortalState> {
state = { placement: null };
static childContextTypes = {
getPortalPlacement: PropTypes.func,
};
getChildContext() {
return {
getPortalPlacement: this.getPortalPlacement,
};
}

// callback for occassions where the menu must "flip"
getPortalPlacement = ({ placement }: MenuState) => {
Expand Down Expand Up @@ -526,6 +519,10 @@ export class MenuPortal extends Component<MenuPortalProps, MenuPortalState> {
<div css={getStyles('menuPortal', state)}>{children}</div>
);

return appendTo ? createPortal(menuWrapper, appendTo) : menuWrapper;
return (
<PortalPlacementContext.Provider value={this.getPortalPlacement}>
{appendTo ? createPortal(menuWrapper, appendTo) : menuWrapper}
</PortalPlacementContext.Provider>
);
}
}

0 comments on commit d284f40

Please sign in to comment.