mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-20 01:41:51 +08:00

Some checks are pending
Publish Any Commit / build (push) Waiting to run
🔀 Sync mirror to Gitee / mirror (push) Waiting to run
✅ test / lint (push) Waiting to run
✅ test / test-react-legacy (16, 1/2) (push) Waiting to run
✅ test / test-react-legacy (16, 2/2) (push) Waiting to run
✅ test / test-react-legacy (17, 1/2) (push) Waiting to run
✅ test / test-react-legacy (17, 2/2) (push) Waiting to run
✅ test / test-node (push) Waiting to run
✅ test / test-react-latest (dom, 1/2) (push) Waiting to run
✅ test / test-react-latest (dom, 2/2) (push) Waiting to run
✅ test / test-react-latest-dist (dist, 1/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist, 2/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist-min, 1/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist-min, 2/2) (push) Blocked by required conditions
✅ test / test-coverage (push) Blocked by required conditions
✅ test / build (push) Waiting to run
✅ test / test lib/es module (es, 1/2) (push) Waiting to run
✅ test / test lib/es module (es, 2/2) (push) Waiting to run
✅ test / test lib/es module (lib, 1/2) (push) Waiting to run
✅ test / test lib/es module (lib, 2/2) (push) Waiting to run
👁️ Visual Regression Persist Start / test image (push) Waiting to run
* refactor: use breakpoint * refactor: add hooks * chore: clean up * chore: fix logic * chore: fix logic * chore: fix ts * chore: fix ts
34 lines
1.1 KiB
TypeScript
34 lines
1.1 KiB
TypeScript
import { useRef } from 'react';
|
|
import useLayoutEffect from 'rc-util/lib/hooks/useLayoutEffect';
|
|
|
|
import useForceUpdate from '../../_util/hooks/useForceUpdate';
|
|
import type { ScreenMap } from '../../_util/responsiveObserver';
|
|
import useResponsiveObserver from '../../_util/responsiveObserver';
|
|
|
|
function useBreakpoint(refreshOnChange: boolean, defaultScreens: null): ScreenMap | null;
|
|
function useBreakpoint(refreshOnChange?: boolean, defaultScreens?: ScreenMap): ScreenMap;
|
|
|
|
function useBreakpoint(
|
|
refreshOnChange = true,
|
|
defaultScreens: ScreenMap | null = {} as ScreenMap,
|
|
): ScreenMap | null {
|
|
const screensRef = useRef<ScreenMap | null>(defaultScreens);
|
|
const forceUpdate = useForceUpdate();
|
|
const responsiveObserver = useResponsiveObserver();
|
|
|
|
useLayoutEffect(() => {
|
|
const token = responsiveObserver.subscribe((supportScreens) => {
|
|
screensRef.current = supportScreens;
|
|
if (refreshOnChange) {
|
|
forceUpdate();
|
|
}
|
|
});
|
|
|
|
return () => responsiveObserver.unsubscribe(token);
|
|
}, []);
|
|
|
|
return screensRef.current;
|
|
}
|
|
|
|
export default useBreakpoint;
|