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

A design system for building ambitious products.

"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// components/hooks/useScreen.ts
var useScreen_exports = {};
__export(useScreen_exports, {
  default: () => useScreen_default
});
module.exports = __toCommonJS(useScreen_exports);
var import_react = require("react");
var useScreenSize = () => {
  const [screenSize, setScreenSize] = (0, import_react.useState)({ width: 0, height: 0 });
  function onResize(event) {
    setScreenSize({
      width: event.target.innerWidth,
      height: event.target.innerHeight
    });
  }
  (0, import_react.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;