useBreakpoint.js 781 B

12345678910111213141516171819202122
  1. "use client";
  2. import { useRef } from 'react';
  3. import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
  4. import useForceUpdate from '../../_util/hooks/useForceUpdate';
  5. import useResponsiveObserver from '../../_util/responsiveObserver';
  6. function useBreakpoint(refreshOnChange = true, defaultScreens = {}) {
  7. const screensRef = useRef(defaultScreens);
  8. const forceUpdate = useForceUpdate();
  9. const responsiveObserver = useResponsiveObserver();
  10. useLayoutEffect(() => {
  11. const token = responsiveObserver.subscribe(supportScreens => {
  12. screensRef.current = supportScreens;
  13. if (refreshOnChange) {
  14. forceUpdate();
  15. }
  16. });
  17. return () => responsiveObserver.unsubscribe(token);
  18. }, []);
  19. return screensRef.current;
  20. }
  21. export default useBreakpoint;