- {typeof children === 'function' ? children({ scheduleUpdate }) : children}
+ {({ ref, style, placement: popperPlacement, isReferenceHidden, arrowProps, update }) => (
+
+ {typeof children === 'function' ? children({ update }) : children}
{!hideArrow && }
)}
diff --git a/src/TooltipPopoverWrapper.js b/src/TooltipPopoverWrapper.js
index fbb3e3107..43870db7c 100644
--- a/src/TooltipPopoverWrapper.js
+++ b/src/TooltipPopoverWrapper.js
@@ -31,9 +31,9 @@ export const propTypes = {
PropTypes.shape({ show: PropTypes.number, hide: PropTypes.number }),
PropTypes.number
]),
- modifiers: PropTypes.object,
+ modifiers: PropTypes.array,
positionFixed: PropTypes.bool,
- offset: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+ offset: PropTypes.arrayOf(PropTypes.number),
innerRef: PropTypes.oneOfType([
PropTypes.func,
PropTypes.string,
@@ -381,7 +381,7 @@ class TooltipPopoverWrapper extends React.Component {
fade={fade}
flip={flip}
>
- {({ scheduleUpdate }) => (
+ {({ update }) => (
- {typeof children === 'function' ? children({ scheduleUpdate }) : children}
+ {typeof children === 'function' ? children({ update }) : children}
)}
diff --git a/src/__tests__/DropdownMenu.spec.js b/src/__tests__/DropdownMenu.spec.js
index f1b356dce..b49d44d1b 100644
--- a/src/__tests__/DropdownMenu.spec.js
+++ b/src/__tests__/DropdownMenu.spec.js
@@ -146,7 +146,9 @@ describe('DropdownMenu', () => {
);
- expect(wrapper.find(Popper).prop('modifiers')).toBe(undefined);
+ const modifiers = wrapper.find(Popper).prop('modifiers');
+ expect(modifiers.length).toBe(1);
+ expect(modifiers).toContainEqual({"enabled": true, "name": "flip"});
});
it('should disable flip modifier when flip is false', () => {
@@ -157,7 +159,7 @@ describe('DropdownMenu', () => {
);
- expect(wrapper.find(Popper).prop('modifiers')).toEqual({ flip: { enabled: false } });
+ expect(wrapper.find(Popper).prop('modifiers')).toEqual([{"enabled": false, "name": "flip"}]);
});
it('should position using fixed mode when positionFixed is true', () => {
@@ -168,7 +170,7 @@ describe('DropdownMenu', () => {
);
- expect(wrapper.find(Popper).prop('positionFixed')).toBe(true);
+ expect(wrapper.find(Popper).prop('strategy')).toBe('fixed');
});
it('should not render Popper when isOpen is false', () => {
diff --git a/src/__tests__/PopperContent.spec.js b/src/__tests__/PopperContent.spec.js
index 233304b41..4bcb7d140 100644
--- a/src/__tests__/PopperContent.spec.js
+++ b/src/__tests__/PopperContent.spec.js
@@ -93,38 +93,63 @@ describe('PopperContent', () => {
target="target"
isOpen
container="inline"
- modifiers={{
- preventOverflow: { boundariesElement: 'viewport' },
- offset: { offset: 2 },
- }}
+ modifiers={[
+ {
+ name: 'offset',
+ options: {
+ offset: [2, 2],
+ },
+ },
+ {
+ name: 'preventOverflow',
+ options: {
+ boundary: 'viewport',
+ },
+ },
+ ]}
>Yo!
);
- expect(wrapper.find(Popper).props().modifiers).toMatchObject({
- // remaining default modifiers
- flip: { enabled: true, behavior: 'flip' },
-
- // additional modifiers
- preventOverflow: { boundariesElement: 'viewport' },
-
- // override modifiers
- offset: { offset: 2 },
- });
+ expect(wrapper.find(Popper).props().modifiers).toContainEqual(
+ {
+ name: 'offset',
+ options: {
+ offset: [2, 2],
+ },
+ }
+ );
+ expect(wrapper.find(Popper).props().modifiers).toContainEqual(
+ {
+ name: 'flip',
+ enabled: true,
+ options: {
+ fallbackPlacements: undefined,
+ },
+ }
+ );
+ expect(wrapper.find(Popper).props().modifiers).toContainEqual(
+ {
+ name: 'preventOverflow',
+ options: {
+ boundary: 'viewport',
+ },
+ },
+ );
wrapper.unmount();
});
- it('should have x-placement of auto by default', () => {
+ it('should have data-popper-placement of auto by default', () => {
const wrapper = mount(
Yo!);
- expect(wrapper.find('div[x-placement="auto"]').exists()).toBe(true);
+ expect(wrapper.find('div[data-popper-placement="auto"]').exists()).toBe(true);
});
- it('should override x-placement', () => {
+ it('should override data-popper-placement', () => {
const wrapper = mount(
Yo!);
- expect(wrapper.find('div[x-placement="auto"]').exists()).toBe(false);
- expect(wrapper.find('div[x-placement="top"]').exists()).toBe(true);
+ expect(wrapper.find('div[data-popper-placement="auto"]').exists()).toBe(false);
+ expect(wrapper.find('div[data-popper-placement="top"]').exists()).toBe(true);
});
it('should allow for a placement prefix', () => {
@@ -137,7 +162,7 @@ describe('PopperContent', () => {
const wrapper = mount(
Yo!);
expect(wrapper.find('.dropdown-auto').exists()).toBe(true);
- expect(wrapper.find('div[x-placement="top"]').exists()).toBe(true);
+ expect(wrapper.find('div[data-popper-placement="top"]').exists()).toBe(true);
});
it('should render custom tag for the popper', () => {
diff --git a/src/__tests__/TooltipPopoverWrapper.spec.js b/src/__tests__/TooltipPopoverWrapper.spec.js
index c61c6f28e..c17b5a2a6 100644
--- a/src/__tests__/TooltipPopoverWrapper.spec.js
+++ b/src/__tests__/TooltipPopoverWrapper.spec.js
@@ -290,19 +290,41 @@ describe('Tooltip', () => {
Tooltip Content
);
- expect(wrapper.find(PopperContent).props().modifiers).toEqual({
- preventOverflow: { boundariesElement: 'viewport' },
- offset: { offset: 2 },
- });
+ expect(wrapper.find(PopperContent).props().modifiers).toContainEqual(
+ {
+ name: 'offset',
+ options: {
+ offset: [2, 2],
+ },
+ }
+ );
+ expect(wrapper.find(PopperContent).props().modifiers).toContainEqual(
+ {
+ name: 'preventOverflow',
+ options: {
+ boundary: 'viewport',
+ },
+ },
+ );
wrapper.unmount();
});
diff --git a/types/lib/Popover.d.ts b/types/lib/Popover.d.ts
index 02151c14e..361c00a22 100644
--- a/types/lib/Popover.d.ts
+++ b/types/lib/Popover.d.ts
@@ -3,7 +3,7 @@ import * as Popper from 'popper.js';
import { CSSModule } from './index';
interface PopoverChildrenRenderProps {
- scheduleUpdate: () => void;
+ update: () => void;
}
export type PopoverChildren =
diff --git a/types/lib/Tooltip.d.ts b/types/lib/Tooltip.d.ts
index e76b46af7..e3dc6bdba 100644
--- a/types/lib/Tooltip.d.ts
+++ b/types/lib/Tooltip.d.ts
@@ -3,7 +3,7 @@ import * as Popper from 'popper.js';
import { CSSModule } from './index';
interface TooltipChildrenRenderProps {
- scheduleUpdate: () => void;
+ update: () => void;
}
export type TooltipChildren =
diff --git a/yarn.lock b/yarn.lock
index a9804616a..c43f64409 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1370,14 +1370,6 @@
resolved "https://registry.yarnpkg.com/@hutson/parse-repository-url/-/parse-repository-url-3.0.2.tgz#98c23c950a3d9b6c8f0daed06da6c3af06981340"
integrity sha512-H9XAx3hc0BQHY6l+IFSWHDySypcXsvsuLhgYLUGywmJ5pswRVQJUHpOsobnLYp2ZUaUlKiKDrgWWhosOwAEM8Q==
-"@hypnosphi/create-react-context@^0.3.1":
- version "0.3.1"
- resolved "https://registry.yarnpkg.com/@hypnosphi/create-react-context/-/create-react-context-0.3.1.tgz#f8bfebdc7665f5d426cba3753e0e9c7d3154d7c6"
- integrity sha512-V1klUed202XahrWJLLOT3EXNeCpFHCcJntdFGI15ntCwau+jfT386w7OFTMaCqOgXUH1fa0w/I1oZs+i/Rfr0A==
- dependencies:
- gud "^1.0.0"
- warning "^4.0.3"
-
"@mrmlnc/readdir-enhanced@^2.2.1":
version "2.2.1"
resolved "https://registry.yarnpkg.com/@mrmlnc/readdir-enhanced/-/readdir-enhanced-2.2.1.tgz#524af240d1a360527b730475ecfa1344aa540dde"
@@ -1424,6 +1416,11 @@
dependencies:
mkdirp "^1.0.4"
+"@popperjs/core@^2.6.0":
+ version "2.10.1"
+ resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.10.1.tgz#728ecd95ab207aab8a9a4e421f0422db329232be"
+ integrity sha512-HnUhk1Sy9IuKrxEMdIRCxpIqPw6BFsbYSEUO9p/hNw5sMld/+3OLMWQP80F8/db9qsv3qUjs7ZR5bS/R+iinXw==
+
"@svgr/core@^2.4.1":
version "2.4.1"
resolved "https://registry.yarnpkg.com/@svgr/core/-/core-2.4.1.tgz#03a407c28c4a1d84305ae95021e8eabfda8fa731"
@@ -4624,7 +4621,7 @@ decode-uri-component@^0.2.0:
resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.0.tgz#eb3913333458775cb84cd1a1fae062106bb87545"
integrity sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU=
-deep-equal@^1.0.1, deep-equal@^1.1.1:
+deep-equal@^1.0.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/deep-equal/-/deep-equal-1.1.1.tgz#b5c98c942ceffaf7cb051e24e1434a25a2e6076a"
integrity sha512-yd9c5AdiqVcR+JjcwUQb9DkhJc8ngNr0MahEBGvDiJw8puWab2yZlh+nkasOnZP+EGTAP6rRp2JzJhJZzvNF8g==
@@ -6702,11 +6699,6 @@ growly@^1.3.0:
resolved "https://registry.yarnpkg.com/growly/-/growly-1.3.0.tgz#f10748cbe76af964b7c96c93c6bcc28af120c081"
integrity sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE=
-gud@^1.0.0:
- version "1.0.0"
- resolved "https://registry.yarnpkg.com/gud/-/gud-1.0.0.tgz#a489581b17e6a70beca9abe3ae57de7a499852c0"
- integrity sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw==
-
gzip-size@5.0.0:
version "5.0.0"
resolved "https://registry.yarnpkg.com/gzip-size/-/gzip-size-5.0.0.tgz#a55ecd99222f4c48fd8c01c625ce3b349d0a0e80"
@@ -10370,11 +10362,6 @@ pnp-webpack-plugin@1.1.0:
resolved "https://registry.yarnpkg.com/pnp-webpack-plugin/-/pnp-webpack-plugin-1.1.0.tgz#947a96d1db94bb5a1fc014d83b581e428699ac8c"
integrity sha512-CPCdcFxx7fEcDMWTDjXe2Wypt4JuMt4q5Q2UrpTcyBBkLiCIyPEh/mCGmUWIcNkKGyXwQ9Y2wVhlKm6ketiBNQ==
-popper.js@^1.14.4:
- version "1.16.1"
- resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.16.1.tgz#2a223cb3dc7b6213d740e40372be40de43e65b1b"
- integrity sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==
-
portfinder@^1.0.26, portfinder@^1.0.9:
version "1.0.26"
resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.26.tgz#475658d56ca30bed72ac7f1378ed350bd1b64e70"
@@ -11132,7 +11119,7 @@ prop-types-exact@^1.2.0:
object.assign "^4.1.0"
reflect.ownkeys "^0.2.0"
-prop-types@^15.5.4, prop-types@^15.5.8, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
+prop-types@^15.5.4, prop-types@^15.5.8, prop-types@^15.6.2, prop-types@^15.7.2:
version "15.7.2"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
@@ -11417,6 +11404,11 @@ react-fast-compare@^2.0.2:
resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-2.0.4.tgz#e84b4d455b0fec113e0402c329352715196f81f9"
integrity sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==
+react-fast-compare@^3.0.1:
+ version "3.2.0"
+ resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.0.tgz#641a9da81b6a6320f270e89724fb45a0b39e43bb"
+ integrity sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==
+
react-helmet@^5.0.3:
version "5.2.1"
resolved "https://registry.yarnpkg.com/react-helmet/-/react-helmet-5.2.1.tgz#16a7192fdd09951f8e0fe22ffccbf9bb3e591ffa"
@@ -11437,17 +11429,12 @@ react-lifecycles-compat@^3.0.4:
resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
integrity sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==
-react-popper@^1.3.6:
- version "1.3.11"
- resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-1.3.11.tgz#a2cc3f0a67b75b66cfa62d2c409f9dd1fcc71ffd"
- integrity sha512-VSA/bS+pSndSF2fiasHK/PTEEAyOpX60+H5EPAjoArr8JGm+oihu4UbrqcEBpQibJxBVCpYyjAX7abJ+7DoYVg==
+react-popper@^2.2.4:
+ version "2.2.5"
+ resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-2.2.5.tgz#1214ef3cec86330a171671a4fbcbeeb65ee58e96"
+ integrity sha512-kxGkS80eQGtLl18+uig1UIf9MKixFSyPxglsgLBxlYnyDf65BiY9B3nZSc6C9XUNDgStROB0fMQlTEz1KxGddw==
dependencies:
- "@babel/runtime" "^7.1.2"
- "@hypnosphi/create-react-context" "^0.3.1"
- deep-equal "^1.1.1"
- popper.js "^1.14.4"
- prop-types "^15.6.1"
- typed-styles "^0.0.7"
+ react-fast-compare "^3.0.1"
warning "^4.0.2"
react-prism@^4.3.2:
@@ -13575,11 +13562,6 @@ type-is@~1.6.17, type-is@~1.6.18:
media-typer "0.3.0"
mime-types "~2.1.24"
-typed-styles@^0.0.7:
- version "0.0.7"
- resolved "https://registry.yarnpkg.com/typed-styles/-/typed-styles-0.0.7.tgz#93392a008794c4595119ff62dde6809dbc40a3d9"
- integrity sha512-pzP0PWoZUhsECYjABgCGQlRGL1n7tOHsgwYv3oIiEpJwGhFTuty/YNeduxQYzXXa3Ge5BdT6sHYIQYpl4uJ+5Q==
-
typedarray@^0.0.6:
version "0.0.6"
resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
@@ -13896,7 +13878,7 @@ warning@^3.0.0:
dependencies:
loose-envify "^1.0.0"
-warning@^4.0.2, warning@^4.0.3:
+warning@^4.0.2:
version "4.0.3"
resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3"
integrity sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==