@kloudlite/design-system/mjs/hooks/useScreen.js

A design system for building ambitious products.

// components/hooks/useScreen.ts
import { useEffect, useState } from "react";
var useScreenSize = () => {
  const [screenSize, setScreenSize] = useState({ width: 0, height: 0 });
  function onResize(event) {
    setScreenSize({
      width: event.target.innerWidth,
      height: event.target.innerHeight
    });
  }
  useEffect(() => {
    if (typeof window !== "undefined") {
      if (screenSize.width === 0 && screenSize.height === 0) {
        onResize({ target: window });
      }
      window.addEventListener("resize", onResize, true);
      return () => {
        window.removeEventListener("resize", onResize);
      };
    }
    return () => {
    };
  }, []);
  return screenSize;
};
var useScreen_default = useScreenSize;
export {
  useScreen_default as default
};