webdev-power-kit/dist/browser/screen-info/index.js

A powerful toolkit that simplifies access to browser features like clipboard, notifications, battery, vibration, and more — perfect for modern web developers.

/**
 * Get current screen and viewport info
 */
export function getScreenInfo() {
    const orientation = (screen.orientation || {}).type || "unknown";
    return {
        width: window.innerWidth,
        height: window.innerHeight,
        availWidth: screen.availWidth,
        availHeight: screen.availHeight,
        devicePixelRatio: window.devicePixelRatio,
        orientation: orientation,
        isLandscape: window.innerWidth > window.innerHeight
    };
}
/**
 * Listen for screen size changes (resize/orientation change)
 */
export function onScreenResize(callback) {
    const handler = () => callback(getScreenInfo());
    window.addEventListener("resize", handler);
    window.addEventListener("orientationchange", handler);
}