diff --git a/package.json b/package.json index 17e1969a747..d70964befae 100644 --- a/package.json +++ b/package.json @@ -153,7 +153,6 @@ "react": "^17.0.2", "react-axe": "^3.0.2", "react-dom": "^17.0.2", - "react-overlays": "0.8.3", "react-test-renderer": "^16.9.0", "recursive-readdir": "^2.2.2", "regenerator-runtime": "0.13.3", diff --git a/packages/@react-aria/overlays/package.json b/packages/@react-aria/overlays/package.json index 0f00233fd9e..377820fbd6b 100644 --- a/packages/@react-aria/overlays/package.json +++ b/packages/@react-aria/overlays/package.json @@ -26,7 +26,8 @@ "@react-types/button": "^3.4.5", "@react-types/overlays": "^3.5.5", "@react-types/shared": "^3.12.0", - "dom-helpers": "^3.3.1" + "dom-helpers": "^5.2.1", + "react-transition-group": "^4.4.2" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.0-rc.1", diff --git a/packages/@react-aria/overlays/src/calculatePosition.ts b/packages/@react-aria/overlays/src/calculatePosition.ts index 35a1b244b80..b3831182e7d 100644 --- a/packages/@react-aria/overlays/src/calculatePosition.ts +++ b/packages/@react-aria/overlays/src/calculatePosition.ts @@ -11,11 +11,11 @@ */ import {Axis, Placement, PlacementAxis, SizeAxis} from '@react-types/overlays'; -import getCss from 'dom-helpers/style'; -import getOffset from 'dom-helpers/query/offset'; -import getPosition from 'dom-helpers/query/position'; -import getScrollLeft from 'dom-helpers/query/scrollLeft'; -import getScrollTop from 'dom-helpers/query/scrollTop'; +import getCss from 'dom-helpers/css'; +import getOffset from 'dom-helpers/offset'; +import getPosition from 'dom-helpers/position'; +import getScrollLeft from 'dom-helpers/scrollLeft'; +import getScrollTop from 'dom-helpers/scrollTop'; import ownerDocument from 'dom-helpers/ownerDocument'; interface Position { @@ -99,7 +99,7 @@ const PARSED_PLACEMENT_CACHE = {}; // @ts-ignore let visualViewport = typeof window !== 'undefined' && window.visualViewport; -function getContainerDimensions(containerNode: Element): Dimensions { +function getContainerDimensions(containerNode: HTMLElement): Dimensions { let width = 0, height = 0, top = 0, left = 0; let scroll: Position = {}; @@ -373,15 +373,17 @@ export function calculatePosition(opts: PositionOpts): PositionResult { maxHeight } = opts; - let container = overlayNode.offsetParent || document.body; + let container = (overlayNode.offsetParent || document.body) as HTMLElement; let isBodyContainer = container.tagName === 'BODY'; const containerPositionStyle = window.getComputedStyle(container).position; let isContainerPositioned = !!containerPositionStyle && containerPositionStyle !== 'static'; let childOffset: Offset = isBodyContainer ? getOffset(targetNode) : getPosition(targetNode, container); if (!isBodyContainer) { - childOffset.top += parseInt(getCss(targetNode, 'marginTop'), 10) || 0; - childOffset.left += parseInt(getCss(targetNode, 'marginLeft'), 10) || 0; + let marginTop = String(getCss(targetNode, 'marginTop')); + let marginLeft = String(getCss(targetNode, 'marginLeft')); + childOffset.top += parseInt(marginTop, 10) || 0; + childOffset.left += parseInt(marginLeft, 10) || 0; } let overlaySize: Offset = getOffset(overlayNode); diff --git a/yarn.lock b/yarn.lock index 26abc8ae97e..a84c47acc01 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8661,14 +8661,14 @@ dom-converter@^0.2: dependencies: utila "~0.4" -dom-helpers@^3.2.1, dom-helpers@^3.3.1, dom-helpers@^3.4.0: +dom-helpers@^3.4.0: version "3.4.0" resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-3.4.0.tgz#e9b369700f959f62ecde5a6babde4bccd9169af8" integrity sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA== dependencies: "@babel/runtime" "^7.1.2" -dom-helpers@^5.0.1: +dom-helpers@^5.0.1, dom-helpers@^5.2.1: version "5.2.1" resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-5.2.1.tgz#d9400536b2bf8225ad98fe052e029451ac40e902" integrity sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA== @@ -17706,14 +17706,6 @@ promzard@^0.3.0: dependencies: read "1" -prop-types-extra@^1.0.1: - version "1.1.0" - resolved "https://registry.yarnpkg.com/prop-types-extra/-/prop-types-extra-1.1.0.tgz#32609910ea2dcf190366bacd3490d5a6412a605f" - integrity sha512-QFyuDxvMipmIVKD2TwxLVPzMnO4e5oOf1vr3tJIomL8E7d0lr6phTHd5nkPhFIzTD1idBLLEPeylL9g+rrTzRg== - dependencies: - react-is "^16.3.2" - warning "^3.0.0" - prop-types@^15.0.0, prop-types@^15.5.10, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, 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" @@ -18234,7 +18226,7 @@ react-inspector@^5.0.1: is-dom "^1.0.0" prop-types "^15.0.0" -react-is@^16.12.0, react-is@^16.3.2, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.6: +react-is@^16.12.0, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.6: version "16.13.1" resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== @@ -18257,18 +18249,6 @@ react-lowlight@^2.0.0: lowlight "^1.9.1" prop-types "^15.6.0" -react-overlays@0.8.3: - version "0.8.3" - resolved "https://registry.yarnpkg.com/react-overlays/-/react-overlays-0.8.3.tgz#fad65eea5b24301cca192a169f5dddb0b20d3ac5" - integrity sha512-h6GT3jgy90PgctleP39Yu3eK1v9vaJAW73GOA/UbN9dJ7aAN4BTZD6793eI1D5U+ukMk17qiqN/wl3diK1Z5LA== - dependencies: - classnames "^2.2.5" - dom-helpers "^3.2.1" - prop-types "^15.5.10" - prop-types-extra "^1.0.1" - react-transition-group "^2.2.0" - warning "^3.0.0" - react-popper-tooltip@^3.1.1: version "3.1.1" resolved "https://registry.yarnpkg.com/react-popper-tooltip/-/react-popper-tooltip-3.1.1.tgz#329569eb7b287008f04fcbddb6370452ad3f9eac" @@ -21869,13 +21849,6 @@ walker@^1.0.7: dependencies: makeerror "1.0.x" -warning@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/warning/-/warning-3.0.0.tgz#32e5377cb572de4ab04753bdf8821c01ed605b7c" - integrity sha1-MuU3fLVy3kqwR1O9+IIcAe1gW3w= - dependencies: - loose-envify "^1.0.0" - warning@^4.0.2, warning@^4.0.3: version "4.0.3" resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3"