Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 | 82x 32x 1x 31x 29x 2x 2x 32x | import type { WindowSize } from "./types";
/**
* Check whether the window object is available.
* Returns false in SSR environments where `window` is not defined.
*
* @returns true if running in a browser environment
*
* @example
* ```tsx
* if (isWindowAvailable()) {
* // Safe to read window.innerWidth
* }
* ```
*/
export function isWindowAvailable(): boolean {
return typeof window !== "undefined";
}
/**
* Read the current window size.
*
* @param includeScrollbar - When true, uses `window.innerWidth`/`innerHeight`
* (includes the scrollbar). When false, uses `document.documentElement`
* `clientWidth`/`clientHeight` (excludes the scrollbar). Defaults to true.
* @returns The current window size, or `{ width: 0, height: 0 }` in SSR.
*
* @example
* ```tsx
* const { width, height } = getWindowSize(); // includes scrollbar
* const inner = getWindowSize(false); // excludes scrollbar
* ```
*/
export function getWindowSize(includeScrollbar = true): WindowSize {
if (!isWindowAvailable()) {
return { width: 0, height: 0 };
}
if (includeScrollbar) {
return { width: window.innerWidth, height: window.innerHeight };
}
const doc = document.documentElement;
return { width: doc.clientWidth, height: doc.clientHeight };
}
/**
* Compare two window sizes for equality.
* Used to skip state updates (and re-renders) when the size hasn't changed.
*
* @param a - First size
* @param b - Second size
* @returns true if both width and height are equal
*
* @example
* ```tsx
* areSizesEqual({ width: 100, height: 50 }, { width: 100, height: 50 }); // true
* ```
*/
export function areSizesEqual(a: WindowSize, b: WindowSize): boolean {
return a.width === b.width && a.height === b.height;
}
|