diff --git a/site/package.json b/site/package.json index 982a3413d..2d4b8d310 100644 --- a/site/package.json +++ b/site/package.json @@ -39,10 +39,14 @@ "algolia:update": "node scripts/search/update-data.js", "algolia:clean": "node scripts/search/clean.js" }, + "resolutions": { + "@mui/styled-engine": "npm:@mui/styled-engine-sc@latest" + }, "dependencies": { "@babel/runtime": "^7.3.4", "@icons/material": "^0.4.1", "@internationalized/number": "^3.0.3", + "@juggle/resize-observer": "^3.3.1", "@mui/material": "^5.0.4", "@mui/styled-engine": "npm:@mui/styled-engine-sc@latest", "@react-aria/button": "^3.3.4", diff --git a/site/source/components/ui/animate.tsx b/site/source/components/ui/animate.tsx index 464e5ea94..5b67e3fa5 100644 --- a/site/source/components/ui/animate.tsx +++ b/site/source/components/ui/animate.tsx @@ -9,6 +9,7 @@ import { } from 'react-spring' import useMeasure from 'react-use-measure' import styled from 'styled-components' +import { ResizeObserver } from '@juggle/resize-observer' type Props = { children: React.ReactNode @@ -114,7 +115,7 @@ export function Appear({ delay = 0, style, }: Props & { unless?: boolean }) { - const [ref, { height }] = useMeasure() + const [ref, { height }] = useMeasure({ polyfill: ResizeObserver }) const animatedStyle = useSpring({ delay, config, diff --git a/yarn.lock b/yarn.lock index 75024fff2..1922ba061 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1455,6 +1455,11 @@ "@types/yargs" "^16.0.0" chalk "^4.0.0" +"@juggle/resize-observer@^3.3.1": + version "3.3.1" + resolved "https://registry.yarnpkg.com/@juggle/resize-observer/-/resize-observer-3.3.1.tgz#b50a781709c81e10701004214340f25475a171a0" + integrity sha512-zMM9Ds+SawiUkakS7y94Ymqx+S0ORzpG3frZirN3l+UlXUmSUR7hF4wxCVqW+ei94JzV5kt0uXBcoOEAuiydrw== + "@mui/base@5.0.0-alpha.58": version "5.0.0-alpha.58" resolved "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.58.tgz" @@ -1496,9 +1501,9 @@ prop-types "^15.7.2" "@mui/styled-engine@^5.2.0", "@mui/styled-engine@npm:@mui/styled-engine-sc@latest": - version "5.1.0" - resolved "https://registry.yarnpkg.com/@mui/styled-engine-sc/-/styled-engine-sc-5.1.0.tgz#672fcc97192a7286cf306c92e71bad84eb0885a1" - integrity sha512-5ZELhN5OAU65CDOutaB8WCo/tVJY0Sc93LnS+dZovCID4kzjvCtqbQZIbvutc3nvDl1GFukhMkG8oaGWLAsbkw== + version "5.3.0" + resolved "https://registry.yarnpkg.com/@mui/styled-engine-sc/-/styled-engine-sc-5.3.0.tgz#4e63e1d2b1a74ea5b422f8b1e12140d8f9356ce9" + integrity sha512-dASXl3Xn56tGtDBJC61G4dxsfkkgYaVsqEBqNfmi3NxUjXT7Tlz/wr4FVFJARZ7Fef0NYWNE8sb+exfGecjXyA== dependencies: prop-types "^15.7.2"