@primer/components 0.0.0-2021109221452 → 0.0.0-2021109223232

package/lib/hooks/useFocusTrap.js

@@ -1,52 +1,69 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useFocusTrap = void 0;
-const react_1 = __importDefault(require("react"));
-const focusTrap_1 = require("../behaviors/focusTrap");
-const useProvidedRefOrCreate_1 = require("./useProvidedRefOrCreate");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useFocusTrap = useFocusTrap;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _focusTrap = require("../behaviors/focusTrap");
+
+var _useProvidedRefOrCreate = require("./useProvidedRefOrCreate");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 /**
  * Hook used to trap focus inside a container. Returns a ref that can be added to the container
  * that should trap focus.
  * @param settings {FocusTrapHookSettings}
  */
 function useFocusTrap(settings, dependencies = []) {
-    const containerRef = useProvidedRefOrCreate_1.useProvidedRefOrCreate(settings?.containerRef);
-    const initialFocusRef = useProvidedRefOrCreate_1.useProvidedRefOrCreate(settings?.initialFocusRef);
-    const disabled = settings?.disabled;
-    const abortController = react_1.default.useRef();
-    const previousFocusedElement = react_1.default.useRef(null);
-    // If we are enabling a focus trap and haven't already stored the previously focused element
-    // go ahead an do that so we can restore later when the trap is disabled.
-    if (!previousFocusedElement.current && !settings?.disabled) {
-        previousFocusedElement.current = document.activeElement;
+  const containerRef = (0, _useProvidedRefOrCreate.useProvidedRefOrCreate)(settings === null || settings === void 0 ? void 0 : settings.containerRef);
+  const initialFocusRef = (0, _useProvidedRefOrCreate.useProvidedRefOrCreate)(settings === null || settings === void 0 ? void 0 : settings.initialFocusRef);
+  const disabled = settings === null || settings === void 0 ? void 0 : settings.disabled;
+
+  const abortController = _react.default.useRef();
+
+  const previousFocusedElement = _react.default.useRef(null); // If we are enabling a focus trap and haven't already stored the previously focused element
+  // go ahead an do that so we can restore later when the trap is disabled.
+
+
+  if (!previousFocusedElement.current && !(settings !== null && settings !== void 0 && settings.disabled)) {
+    previousFocusedElement.current = document.activeElement;
+  } // This function removes the event listeners that enable the focus trap and restores focus
+  // to the previously-focused element (if necessary).
+
+
+  function disableTrap() {
+    var _abortController$curr;
+
+    (_abortController$curr = abortController.current) === null || _abortController$curr === void 0 ? void 0 : _abortController$curr.abort();
+
+    if (settings !== null && settings !== void 0 && settings.restoreFocusOnCleanUp && previousFocusedElement.current instanceof HTMLElement) {
+      previousFocusedElement.current.focus();
+      previousFocusedElement.current = null;
     }
-    // This function removes the event listeners that enable the focus trap and restores focus
-    // to the previously-focused element (if necessary).
-    function disableTrap() {
-        abortController.current?.abort();
-        if (settings?.restoreFocusOnCleanUp && previousFocusedElement.current instanceof HTMLElement) {
-            previousFocusedElement.current.focus();
-            previousFocusedElement.current = null;
-        }
+  }
+
+  _react.default.useEffect(() => {
+    if (containerRef.current instanceof HTMLElement) {
+      if (!disabled) {
+        var _initialFocusRef$curr;
+
+        abortController.current = (0, _focusTrap.focusTrap)(containerRef.current, (_initialFocusRef$curr = initialFocusRef.current) !== null && _initialFocusRef$curr !== void 0 ? _initialFocusRef$curr : undefined);
+        return () => {
+          disableTrap();
+        };
+      } else {
+        disableTrap();
+      }
     }
-    react_1.default.useEffect(() => {
-        if (containerRef.current instanceof HTMLElement) {
-            if (!disabled) {
-                abortController.current = focusTrap_1.focusTrap(containerRef.current, initialFocusRef.current ?? undefined);
-                return () => {
-                    disableTrap();
-                };
-            }
-            else {
-                disableTrap();
-            }
-        }
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [containerRef, initialFocusRef, disabled, ...dependencies]);
-    return { containerRef, initialFocusRef };
-}
-exports.useFocusTrap = useFocusTrap;
+  }, // eslint-disable-next-line react-hooks/exhaustive-deps
+  [containerRef, initialFocusRef, disabled, ...dependencies]);
+
+  return {
+    containerRef,
+    initialFocusRef
+  };
+}

package/lib/hooks/useFocusZone.js

@@ -1,57 +1,53 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useFocusZone = void 0;
-const react_1 = __importStar(require("react"));
-const focusZone_1 = require("../behaviors/focusZone");
-const useProvidedRefOrCreate_1 = require("./useProvidedRefOrCreate");
-function useFocusZone(settings = {}, dependencies = []) {
-    const containerRef = useProvidedRefOrCreate_1.useProvidedRefOrCreate(settings.containerRef);
-    const useActiveDescendant = !!settings.activeDescendantFocus;
-    const passedActiveDescendantRef = typeof settings.activeDescendantFocus === 'boolean' || !settings.activeDescendantFocus
-        ? undefined
-        : settings.activeDescendantFocus;
-    const activeDescendantControlRef = useProvidedRefOrCreate_1.useProvidedRefOrCreate(passedActiveDescendantRef);
-    const disabled = settings.disabled;
-    const abortController = react_1.default.useRef();
-    react_1.useEffect(() => {
-        if (containerRef.current instanceof HTMLElement &&
-            (!useActiveDescendant || activeDescendantControlRef.current instanceof HTMLElement)) {
-            if (!disabled) {
-                const vanillaSettings = {
-                    ...settings,
-                    activeDescendantControl: activeDescendantControlRef.current ?? undefined
-                };
-                abortController.current = focusZone_1.focusZone(containerRef.current, vanillaSettings);
-                return () => {
-                    abortController.current?.abort();
-                };
-            }
-            else {
-                abortController.current?.abort();
-            }
-        }
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [disabled, ...dependencies]);
-    return { containerRef, activeDescendantControlRef };
-}
 exports.useFocusZone = useFocusZone;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _focusZone = require("../behaviors/focusZone");
+
+var _useProvidedRefOrCreate = require("./useProvidedRefOrCreate");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function useFocusZone(settings = {}, dependencies = []) {
+  const containerRef = (0, _useProvidedRefOrCreate.useProvidedRefOrCreate)(settings.containerRef);
+  const useActiveDescendant = !!settings.activeDescendantFocus;
+  const passedActiveDescendantRef = typeof settings.activeDescendantFocus === 'boolean' || !settings.activeDescendantFocus ? undefined : settings.activeDescendantFocus;
+  const activeDescendantControlRef = (0, _useProvidedRefOrCreate.useProvidedRefOrCreate)(passedActiveDescendantRef);
+  const disabled = settings.disabled;
+
+  const abortController = _react.default.useRef();
+
+  (0, _react.useEffect)(() => {
+    if (containerRef.current instanceof HTMLElement && (!useActiveDescendant || activeDescendantControlRef.current instanceof HTMLElement)) {
+      if (!disabled) {
+        var _activeDescendantCont;
+
+        const vanillaSettings = { ...settings,
+          activeDescendantControl: (_activeDescendantCont = activeDescendantControlRef.current) !== null && _activeDescendantCont !== void 0 ? _activeDescendantCont : undefined
+        };
+        abortController.current = (0, _focusZone.focusZone)(containerRef.current, vanillaSettings);
+        return () => {
+          var _abortController$curr;
+
+          (_abortController$curr = abortController.current) === null || _abortController$curr === void 0 ? void 0 : _abortController$curr.abort();
+        };
+      } else {
+        var _abortController$curr2;
+
+        (_abortController$curr2 = abortController.current) === null || _abortController$curr2 === void 0 ? void 0 : _abortController$curr2.abort();
+      }
+    }
+  }, // eslint-disable-next-line react-hooks/exhaustive-deps
+  [disabled, ...dependencies]);
+  return {
+    containerRef,
+    activeDescendantControlRef
+  };
+}

package/lib/hooks/useOnEscapePress.js

@@ -1,22 +1,28 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports.useOnEscapePress = void 0;
-const react_1 = require("react");
+
+var _react = require("react");
+
 const handlers = [];
 /**
  * Calls all handlers in reverse order
  * @param event The KeyboardEvent generated by the Escape keydown.
  */
+
 function handleEscape(event) {
-    if (event.key === 'Escape' && !event.defaultPrevented) {
-        for (let i = handlers.length - 1; i >= 0; --i) {
-            handlers[i](event);
-            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-            if (event.defaultPrevented) {
-                break;
-            }
-        }
+  if (event.key === 'Escape' && !event.defaultPrevented) {
+    for (let i = handlers.length - 1; i >= 0; --i) {
+      handlers[i](event); // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+
+      if (event.defaultPrevented) {
+        break;
+      }
     }
+  }
 }
 /**
  * Sets up a `keydown` listener on `window.document`. If
@@ -39,20 +45,25 @@ function handleEscape(event) {
  * `onEscape` callback for memoization. Omit this param if the callback is already
  * memoized. See `React.useCallback` for more info on memoization.
  */
+
+
 const useOnEscapePress = (onEscape, callbackDependencies = [onEscape]) => {
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    const escapeCallback = react_1.useCallback(onEscape, callbackDependencies);
-    react_1.useEffect(() => {
-        if (handlers.length === 0) {
-            document.addEventListener('keydown', handleEscape);
-        }
-        handlers.push(escapeCallback);
-        return () => {
-            handlers.splice(handlers.findIndex(h => h === escapeCallback), 1);
-            if (handlers.length === 0) {
-                document.removeEventListener('keydown', handleEscape);
-            }
-        };
-    }, [escapeCallback]);
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  const escapeCallback = (0, _react.useCallback)(onEscape, callbackDependencies);
+  (0, _react.useEffect)(() => {
+    if (handlers.length === 0) {
+      document.addEventListener('keydown', handleEscape);
+    }
+
+    handlers.push(escapeCallback);
+    return () => {
+      handlers.splice(handlers.findIndex(h => h === escapeCallback), 1);
+
+      if (handlers.length === 0) {
+        document.removeEventListener('keydown', handleEscape);
+      }
+    };
+  }, [escapeCallback]);
 };
-exports.useOnEscapePress = useOnEscapePress;
+
+exports.useOnEscapePress = useOnEscapePress;

package/lib/hooks/useOpenAndCloseFocus.js

@@ -1,24 +1,36 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useOpenAndCloseFocus = void 0;
-const react_1 = require("react");
-const iterateFocusableElements_1 = require("../utils/iterateFocusableElements");
-function useOpenAndCloseFocus({ initialFocusRef, returnFocusRef, containerRef, preventFocusOnOpen }) {
-    react_1.useEffect(() => {
-        if (preventFocusOnOpen) {
-            return;
-        }
-        const returnRef = returnFocusRef.current;
-        if (initialFocusRef && initialFocusRef.current) {
-            initialFocusRef.current.focus();
-        }
-        else if (containerRef.current) {
-            const firstItem = iterateFocusableElements_1.iterateFocusableElements(containerRef.current).next().value;
-            firstItem?.focus();
-        }
-        return function () {
-            returnRef?.focus();
-        };
-    }, [initialFocusRef, returnFocusRef, containerRef, preventFocusOnOpen]);
-}
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports.useOpenAndCloseFocus = useOpenAndCloseFocus;
+
+var _react = require("react");
+
+var _iterateFocusableElements = require("../utils/iterateFocusableElements");
+
+function useOpenAndCloseFocus({
+  initialFocusRef,
+  returnFocusRef,
+  containerRef,
+  preventFocusOnOpen
+}) {
+  (0, _react.useEffect)(() => {
+    if (preventFocusOnOpen) {
+      return;
+    }
+
+    const returnRef = returnFocusRef.current;
+
+    if (initialFocusRef && initialFocusRef.current) {
+      initialFocusRef.current.focus();
+    } else if (containerRef.current) {
+      const firstItem = (0, _iterateFocusableElements.iterateFocusableElements)(containerRef.current).next().value;
+      firstItem === null || firstItem === void 0 ? void 0 : firstItem.focus();
+    }
+
+    return function () {
+      returnRef === null || returnRef === void 0 ? void 0 : returnRef.focus();
+    };
+  }, [initialFocusRef, returnFocusRef, containerRef, preventFocusOnOpen]);
+}

package/lib/hooks/useProvidedRefOrCreate.js

@@ -1,10 +1,14 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useProvidedRefOrCreate = void 0;
-const react_1 = __importDefault(require("react"));
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useProvidedRefOrCreate = useProvidedRefOrCreate;
+
+var _react = _interopRequireDefault(require("react"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 /**
  * There are some situations where we only want to create a new ref if one is not provided to a component
  * or hook as a prop. However, due to the `rules-of-hooks`, we cannot conditionally make a call to `React.useRef`
@@ -14,7 +18,7 @@ const react_1 = __importDefault(require("react"));
  * @type TRef The type of the RefObject which should be created.
  */
 function useProvidedRefOrCreate(providedRef) {
-    const createdRef = react_1.default.useRef(null);
-    return providedRef ?? createdRef;
-}
-exports.useProvidedRefOrCreate = useProvidedRefOrCreate;
+  const createdRef = _react.default.useRef(null);
+
+  return providedRef !== null && providedRef !== void 0 ? providedRef : createdRef;
+}

package/lib/hooks/useProvidedStateOrCreate.js

@@ -1,7 +1,12 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useProvidedStateOrCreate = void 0;
-const react_1 = require("react");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useProvidedStateOrCreate = useProvidedStateOrCreate;
+
+var _react = require("react");
+
 /**
  * There are some situations where we want to give users the option to control state externally with their own state handlers
  * or default to using internal state handlers. Because of the 'rules-of-hooks', we cannot conditionally make a call to `React.useState`
@@ -12,13 +17,11 @@ const react_1 = require("react");
  * @param defaultState The defaultState to use, if using internal state.
  */
 function useProvidedStateOrCreate(externalState, setExternalState, defaultState) {
-    const [internalState, setInternalState] = react_1.useState(defaultState);
-    const state = externalState ?? internalState;
-    const setState = react_1.useCallback((s) => {
-        setInternalState(s);
-        if (setExternalState)
-            setExternalState(s);
-    }, [setExternalState]);
-    return [state, setState];
-}
-exports.useProvidedStateOrCreate = useProvidedStateOrCreate;
+  const [internalState, setInternalState] = (0, _react.useState)(defaultState);
+  const state = externalState !== null && externalState !== void 0 ? externalState : internalState;
+  const setState = (0, _react.useCallback)(s => {
+    setInternalState(s);
+    if (setExternalState) setExternalState(s);
+  }, [setExternalState]);
+  return [state, setState];
+}

package/lib/hooks/useRenderForcingRef.js

@@ -1,7 +1,12 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useRenderForcingRef = void 0;
-const react_1 = require("react");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useRenderForcingRef = useRenderForcingRef;
+
+var _react = require("react");
+
 /**
  * There are certain situations where a ref might be set after the current render cycle for a
  * component has finished.  e.g. a forward ref from a conditionally rendered child component.
@@ -9,13 +14,12 @@ const react_1 = require("react");
  * @type TRef The type of the RefObject which should be created.
  */
 function useRenderForcingRef() {
-    const [refCurrent, setRefCurrent] = react_1.useState(null);
-    const ref = react_1.useRef(null);
-    ref.current = refCurrent;
-    const setRef = react_1.useCallback((newRef) => {
-        ref.current = newRef;
-        setRefCurrent(newRef);
-    }, [ref]);
-    return [ref, setRef];
-}
-exports.useRenderForcingRef = useRenderForcingRef;
+  const [refCurrent, setRefCurrent] = (0, _react.useState)(null);
+  const ref = (0, _react.useRef)(null);
+  ref.current = refCurrent;
+  const setRef = (0, _react.useCallback)(newRef => {
+    ref.current = newRef;
+    setRefCurrent(newRef);
+  }, [ref]);
+  return [ref, setRef];
+}

package/lib/hooks/useResizeObserver.js

@@ -1,17 +1,20 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useResizeObserver = void 0;
-const react_1 = __importDefault(require("react"));
-function useResizeObserver(callback) {
-    react_1.default.useLayoutEffect(() => {
-        const observer = new window.ResizeObserver(() => callback());
-        observer.observe(document.documentElement);
-        return () => {
-            observer.disconnect();
-        };
-    }, [callback]);
-}
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports.useResizeObserver = useResizeObserver;
+
+var _useIsomorphicLayoutEffect = _interopRequireDefault(require("../utils/useIsomorphicLayoutEffect"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function useResizeObserver(callback) {
+  (0, _useIsomorphicLayoutEffect.default)(() => {
+    const observer = new window.ResizeObserver(() => callback());
+    observer.observe(document.documentElement);
+    return () => {
+      observer.disconnect();
+    };
+  }, [callback]);
+}

package/lib/hooks/useSafeTimeout.js

@@ -1,30 +1,38 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useSafeTimeout;
+
+var _react = require("react");
+
 /**
  * Safely call `setTimeout` and `clearTimeout` within a component.
  *
  * This hook ensures that all timeouts are cleared when the component unmounts.
  */
 function useSafeTimeout() {
-    const timers = react_1.useRef(new Set());
-    const safeSetTimeout = react_1.useCallback((handler, timeout, ...args) => {
-        const id = window.setTimeout(handler, timeout, ...args);
-        timers.current.add(id);
-        return id;
-    }, []);
-    const safeClearTimeout = react_1.useCallback((id) => {
+  const timers = (0, _react.useRef)(new Set());
+  const safeSetTimeout = (0, _react.useCallback)((handler, timeout, ...args) => {
+    const id = window.setTimeout(handler, timeout, ...args);
+    timers.current.add(id);
+    return id;
+  }, []);
+  const safeClearTimeout = (0, _react.useCallback)(id => {
+    clearTimeout(id);
+    timers.current.delete(id);
+  }, []);
+  (0, _react.useEffect)(() => {
+    return () => {
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+      for (const id of timers.current) {
         clearTimeout(id);
-        timers.current.delete(id);
-    }, []);
-    react_1.useEffect(() => {
-        return () => {
-            // eslint-disable-next-line react-hooks/exhaustive-deps
-            for (const id of timers.current) {
-                clearTimeout(id);
-            }
-        };
-    }, []);
-    return { safeSetTimeout, safeClearTimeout };
-}
-exports.default = useSafeTimeout;
+      }
+    };
+  }, []);
+  return {
+    safeSetTimeout,
+    safeClearTimeout
+  };
+}

package/lib/hooks/useScrollFlash.js

@@ -1,22 +1,29 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useScrollFlash;
+
+var _react = require("react");
+
 /**
  * This hook will flash the scrollbars for a ref of a container that has scrollable overflow
  * @param scrollContainerRef The ref of the scrollable content
  */
 function useScrollFlash(scrollContainerRef) {
-    // https://adxlv.computer/projects/flash-scrollers/
-    react_1.useEffect(() => {
-        const scrollContainer = scrollContainerRef.current;
-        if (!scrollContainer) {
-            return;
-        }
-        const currentScroll = scrollContainer.scrollTop;
-        const maxScroll = scrollContainer.scrollHeight;
-        const altScroll = currentScroll < Math.min(1, maxScroll) ? currentScroll + 1 : currentScroll - 1;
-        scrollContainer.scrollTop = altScroll;
-        scrollContainer.scrollTop = currentScroll;
-    }, [scrollContainerRef]);
-}
-exports.default = useScrollFlash;
+  // https://adxlv.computer/projects/flash-scrollers/
+  (0, _react.useEffect)(() => {
+    const scrollContainer = scrollContainerRef.current;
+
+    if (!scrollContainer) {
+      return;
+    }
+
+    const currentScroll = scrollContainer.scrollTop;
+    const maxScroll = scrollContainer.scrollHeight;
+    const altScroll = currentScroll < Math.min(1, maxScroll) ? currentScroll + 1 : currentScroll - 1;
+    scrollContainer.scrollTop = altScroll;
+    scrollContainer.scrollTop = currentScroll;
+  }, [scrollContainerRef]);
+}