@parksuhyun9321/use-media-query 1.0.3 → 1.0.5

package/README.MD

@@ -1,6 +1,10 @@
 # @parksuhyun9321/use-media-query
 
-## 반응형 커스텀 훅 
+## 설치 
+ - npm install @parksuhyun9321@use-media-query
+ - pnpm add @parksuhyun9321@use-media-query
+ - yarn add @parksuhyun9321@use-media-query
 
+## 반응형 커스텀 훅 
 - useMediaQuery 선언 시 maxWidth 값을 주고 브라우저 사이즈에 따라 isResize 상태를 변경
 - 브라우저 뷰포트에 따른 조건부 렌더링을 위해 사용

package/dist/index.cjs

@@ -0,0 +1,43 @@
+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);
+
+// index.ts
+var index_exports = {};
+__export(index_exports, {
+  default: () => index_default
+});
+module.exports = __toCommonJS(index_exports);
+var import_react = require("react");
+var useMediaQuery = (maxWidth) => {
+  const [isResize, SetIsResize] = (0, import_react.useState)(() => {
+    if (typeof window === "undefined") return true;
+    return window.innerWidth < maxWidth;
+  });
+  function ResizeCallback() {
+    const value = window.innerWidth < maxWidth;
+    SetIsResize((prev) => prev === value ? prev : value);
+  }
+  (0, import_react.useEffect)(() => {
+    window.addEventListener("resize", ResizeCallback);
+    return () => {
+      window.removeEventListener("resize", ResizeCallback);
+    };
+  }, [maxWidth]);
+  return { isResize };
+};
+var index_default = useMediaQuery;

package/dist/{index.d.mts → index.d.cts}

@@ -2,4 +2,4 @@ declare const useMediaQuery: (maxWidth: number) => {
     isResize: boolean;
 };
 
-export { useMediaQuery };
+export { useMediaQuery as default };

package/dist/index.d.ts

@@ -2,4 +2,4 @@ declare const useMediaQuery: (maxWidth: number) => {
     isResize: boolean;
 };
 
-export { useMediaQuery };
+export { useMediaQuery as default };

package/dist/index.js

@@ -1,32 +1,7 @@
-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);
-
-// src/index.ts
-var index_exports = {};
-__export(index_exports, {
-  useMediaQuery: () => useMediaQuery
-});
-module.exports = __toCommonJS(index_exports);
-
-// src/useMediaQuery.ts
-var import_react = require("react");
+// index.ts
+import { useEffect, useState } from "react";
 var useMediaQuery = (maxWidth) => {
-  const [isResize, SetIsResize] = (0, import_react.useState)(() => {
+  const [isResize, SetIsResize] = useState(() => {
     if (typeof window === "undefined") return true;
     return window.innerWidth < maxWidth;
   });
@@ -34,7 +9,7 @@ var useMediaQuery = (maxWidth) => {
     const value = window.innerWidth < maxWidth;
     SetIsResize((prev) => prev === value ? prev : value);
   }
-  (0, import_react.useEffect)(() => {
+  useEffect(() => {
     window.addEventListener("resize", ResizeCallback);
     return () => {
       window.removeEventListener("resize", ResizeCallback);
@@ -42,7 +17,7 @@ var useMediaQuery = (maxWidth) => {
   }, [maxWidth]);
   return { isResize };
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  useMediaQuery
-});
+var index_default = useMediaQuery;
+export {
+  index_default as default
+};

package/package.json

@@ -1,13 +1,24 @@
 {
   "name": "@parksuhyun9321/use-media-query",
-  "version": "1.0.3",
+  "version": "1.0.5",
   "description": "",
-  "main": "dist/index.cjs",
-  "module": "dist/index.js",
+  "main": "dist/index.js",
+  "module": "dist/index.cjs",
   "types": "dist/index.d.ts",
   "files": [
     "dist"
   ],
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.cjs",
+      "require": "./dist/index.js"
+    }
+  },
+  "peerDependencies": {
+    "react": ">=18"
+  },
   "keywords": [],
   "author": "",
   "license": "ISC",

package/dist/index.mjs

@@ -1,22 +0,0 @@
-// src/useMediaQuery.ts
-import { useEffect, useState } from "react";
-var useMediaQuery = (maxWidth) => {
-  const [isResize, SetIsResize] = useState(() => {
-    if (typeof window === "undefined") return true;
-    return window.innerWidth < maxWidth;
-  });
-  function ResizeCallback() {
-    const value = window.innerWidth < maxWidth;
-    SetIsResize((prev) => prev === value ? prev : value);
-  }
-  useEffect(() => {
-    window.addEventListener("resize", ResizeCallback);
-    return () => {
-      window.removeEventListener("resize", ResizeCallback);
-    };
-  }, [maxWidth]);
-  return { isResize };
-};
-export {
-  useMediaQuery
-};