From 174ad61f2746c52a67a0022ce77d40bdcdb0235d Mon Sep 17 00:00:00 2001 From: oskar Date: Tue, 21 Apr 2020 19:42:34 +0200 Subject: [PATCH 1/4] Fix useScrollTrigger on page-reload behavior --- .../src/useScrollTrigger/useScrollTrigger.js | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/packages/material-ui/src/useScrollTrigger/useScrollTrigger.js b/packages/material-ui/src/useScrollTrigger/useScrollTrigger.js index 79e0e331c69cc1..07db50ff153809 100644 --- a/packages/material-ui/src/useScrollTrigger/useScrollTrigger.js +++ b/packages/material-ui/src/useScrollTrigger/useScrollTrigger.js @@ -4,10 +4,13 @@ function getScrollY(ref) { return ref.pageYOffset !== undefined ? ref.pageYOffset : ref.scrollTop; } -function defaultTrigger(event, store, options) { - const { disableHysteresis = false, threshold = 100 } = options; +function defaultTrigger(store, options) { + const { disableHysteresis = false, threshold = 100, target } = options; const previous = store.current; - store.current = event ? getScrollY(event.currentTarget) : previous; + + if (target) { + store.current = getScrollY(target); + } if (!disableHysteresis && previous !== undefined) { if (store.current < previous) { @@ -23,14 +26,14 @@ const defaultTarget = typeof window !== 'undefined' ? window : null; export default function useScrollTrigger(options = {}) { const { getTrigger = defaultTrigger, target = defaultTarget, ...other } = options; const store = React.useRef(); - const [trigger, setTrigger] = React.useState(() => getTrigger(null, store, other)); + const [trigger, setTrigger] = React.useState(() => getTrigger(store, other)); React.useEffect(() => { - const handleScroll = (event) => { - setTrigger(getTrigger(event, store, other)); + const handleScroll = () => { + setTrigger(getTrigger(store, { target, ...other})); }; - handleScroll(null); // Re-evaluate trigger when dependencies change + handleScroll(); // Re-evaluate trigger when dependencies change target.addEventListener('scroll', handleScroll); return () => { target.removeEventListener('scroll', handleScroll); From 65c552501dc001fe43d76e1e257f4644a6a2e626 Mon Sep 17 00:00:00 2001 From: oskar Date: Tue, 21 Apr 2020 19:55:24 +0200 Subject: [PATCH 2/4] Format useScrollTrigger --- packages/material-ui/src/useScrollTrigger/useScrollTrigger.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/material-ui/src/useScrollTrigger/useScrollTrigger.js b/packages/material-ui/src/useScrollTrigger/useScrollTrigger.js index 07db50ff153809..cb003a6cff8a10 100644 --- a/packages/material-ui/src/useScrollTrigger/useScrollTrigger.js +++ b/packages/material-ui/src/useScrollTrigger/useScrollTrigger.js @@ -30,7 +30,7 @@ export default function useScrollTrigger(options = {}) { React.useEffect(() => { const handleScroll = () => { - setTrigger(getTrigger(store, { target, ...other})); + setTrigger(getTrigger(store, { target, ...other })); }; handleScroll(); // Re-evaluate trigger when dependencies change From c59ed2b638f04b0202acbdc12aa5c5e5337bb319 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Wed, 22 Apr 2020 01:15:39 +0200 Subject: [PATCH 3/4] use a comment instead of a new function --- .../material-ui/src/useScrollTrigger/useScrollTrigger.js | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/packages/material-ui/src/useScrollTrigger/useScrollTrigger.js b/packages/material-ui/src/useScrollTrigger/useScrollTrigger.js index cb003a6cff8a10..d88baaf06ba1c6 100644 --- a/packages/material-ui/src/useScrollTrigger/useScrollTrigger.js +++ b/packages/material-ui/src/useScrollTrigger/useScrollTrigger.js @@ -1,15 +1,12 @@ import * as React from 'react'; -function getScrollY(ref) { - return ref.pageYOffset !== undefined ? ref.pageYOffset : ref.scrollTop; -} - function defaultTrigger(store, options) { const { disableHysteresis = false, threshold = 100, target } = options; const previous = store.current; if (target) { - store.current = getScrollY(target); + // Get vertical scroll + store.current = target.pageYOffset !== undefined ? target.pageYOffset : target.scrollTop; } if (!disableHysteresis && previous !== undefined) { From f47c00175f24a0837bf1de53b3efa54baf3c43c4 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Wed, 22 Apr 2020 01:20:07 +0200 Subject: [PATCH 4/4] strack bundle size --- scripts/sizeSnapshot/webpack.config.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/scripts/sizeSnapshot/webpack.config.js b/scripts/sizeSnapshot/webpack.config.js index 787b16ba043ca4..eecbc1d081ff32 100644 --- a/scripts/sizeSnapshot/webpack.config.js +++ b/scripts/sizeSnapshot/webpack.config.js @@ -82,6 +82,11 @@ async function getSizeLimitBundles() { webpack: true, path: 'packages/material-ui/build/esm/useMediaQuery/index.js', }, + { + name: '@material-ui/core/useScrollTrigger', + webpack: true, + path: 'packages/material-ui/build/esm/useScrollTrigger/index.js', + }, ]; }