@ptolemy2002/react-mount-effects 1.2.0 → 2.0.0

package/README.md

@@ -2,7 +2,7 @@
 React allows `useEffect(() => {callback()}, [])` to run the callback only on first mount, thus `useEffect(() => callback, [])` only runs on unmounting. However, eslint often complains about this. This library manually suppresses those warnings and exports the hooks for convenience sake.
 
 The hooks are not exported as default, so you can import in one of the following ways:
-```
+```javascript
 //ES6
 import { useMountEffect, useUnmountEffect, useDelayedEffect } from '@ptolemy2002/react-mount-effects';
 //CommonJS
@@ -19,7 +19,7 @@ The following hooks are available in the library:
 Runs the callback only on first mount. The return value of the callback is ignored.
 
 #### Parameters
-- `callback` (Function): The callback to run on first mount.
+- `callback` (`() => void`): The callback to run on first mount.
 
 #### Returns
 None
@@ -29,7 +29,7 @@ None
 Runs the callback only on unmount. The return value of the callback is ignored.
 
 #### Parameters
-- `callback` (Function): The callback to run on unmount.
+- `callback` (`() => void`): The callback to run on unmount.
 
 #### Returns
 None
@@ -39,34 +39,25 @@ None
 Runs the callback only after it has been triggered `delay + 1` times (since the first is on mount and does not represent a state change). The return value of the callback is ignored.
 
 #### Parameters
-- `callback` (Function): The callback to run after the delay. The first parameter is the number of times the effect has been triggered since either initialization or last reset, and the second argument is a function that allows you to reset the counter.
-- `deps` (Array): An array of dependencies to listen to. This works exactly like the `useEffect` hook's dependencies.
-- `delay` (Number): The number of times the dependencies must change before the callback is run. Default is `0`, meaning the callback is run on any change, but not on mount.
+- `callback` (`(changeCount: number, reset: () => void) => void`): The callback to run after the delay. The first parameter is the number of times the effect has been triggered since either initialization or last reset, and the second argument is a function that allows you to reset the counter.
+- `deps` (`react.DependencyList`): An array of dependencies to listen to. This works exactly like the `useEffect` hook's dependencies. By default, this is an empty array.
+- `delay` (`number`): The number of times the dependencies must change before the callback is run. Default is `0`, meaning the callback is run on any change, but not on mount.
 
 #### Returns
 None
 
-## Meta
-This is a React Library Created by Ptolemy2002's [cra-template-react-library](https://www.npmjs.com/package/@ptolemy2002/cra-template-react-library) template in combination with [create-react-app](https://www.npmjs.com/package/create-react-app). It contains methods of building and publishing your library to npm.
-For now, the library makes use of React 18 and does not use TypeScript.
-
 ## Peer Dependencies
-These should be installed in order to use the library, as npm does not automatically add peer dependencies to your project.
-- @types/react: ^18.3.3
-- @types/react-dom: ^18.3.0
-- react: ^18.3.1
-- react-dom: ^18.3.1
+- `react^18.3.1`
+- `react-dom^18.3.1`
 
 ## Commands
 The following commands exist in the project:
 
-- `npm run uninstall` - Uninstalls all dependencies for the library
-- `npm run reinstall` - Uninstalls and then Reinstalls all dependencies for the library
-- `npm run example-uninstall` - Uninstalls all dependencies for the example app
-- `npm run example-install` - Installs all dependencies for the example app
-- `npm run example-reinstall` - Uninstalls and then Reinstalls all dependencies for the example app
-- `npm run example-start` - Starts the example app after building the library
 - `npm run build` - Builds the library
+- `npm run dev` - Starts the development server
+- `npm run lint` - Lints the project
+- `npm run uninstall` - Uninstalls all dependencies for the library and clears the cache
+- `npm run reinstall` - Uninstalls, clears the cache, and then reinstalls all dependencies for the library
 - `npm run release` - Publishes the library to npm without changing the version
 - `npm run release-patch` - Publishes the library to npm with a patch version bump
 - `npm run release-minor` - Publishes the library to npm with a minor version bump

package/dist/main.d.ts

@@ -0,0 +1,4 @@
+import { DependencyList } from 'react';
+export declare function useMountEffect(callback: () => void): void;
+export declare function useUnmountEffect(callback: () => void): void;
+export declare function useDelayedEffect(callback: (changeCount: number, reset: () => void) => void, deps?: DependencyList, delay?: number): void;

package/dist/main.js

@@ -0,0 +1,20 @@
+import { useEffect as n, useRef as c } from "react";
+function o(e) {
+  n(() => {
+    e();
+  }, []);
+}
+function s(e) {
+  n(() => e, []);
+}
+function i(e, u = [], f = 0) {
+  const t = c(0);
+  n(() => {
+    t.current++, t.current > f + 1 && e(t.current, () => t.current = 0);
+  }, u);
+}
+export {
+  i as useDelayedEffect,
+  o as useMountEffect,
+  s as useUnmountEffect
+};

package/package.json

@@ -1,38 +1,63 @@
 {
-    "name": "@ptolemy2002/react-mount-effects",
-    "version": "1.2.0",
-    "main": "index.js",
-    "files": [
-        "index.js"
-    ],
-    "scripts": {
-        "build": "esbuild src/index.js --bundle --format=cjs --outfile=index.js --external:react --external:react-dom --external:@types/react --external:@types/react-dom",
-        "postinstall": "npx typesync",
-        "uninstall": "bash ./scripts/uninstall.sh",
-        "reinstall": "bash ./scripts/reinstall.sh",
-        "example-uninstall": "bash ./scripts/example-uninstall.sh",
-        "example-install": "bash ./scripts/example-install.sh",
-        "example-reinstall": "bash ./scripts/example-reinstall.sh",
-        "example-start": "bash ./scripts/example-start.sh",
-        "release": "bash ./scripts/release.sh",
-        "release-patch": "bash ./scripts/release.sh patch",
-        "release-minor": "bash ./scripts/release.sh minor",
-        "release-major": "bash ./scripts/release.sh major"
-    },
-    "repository": {
-        "type": "git",
-        "url": "https://github.com/Ptolemy2002/react-mount-effects",
-        "directory": "lib"
-    },
-    "description": "Dedicated effect functions for React component mount and unmount",
-    "license": "ISC",
-    "peerDependencies": {
-        "@types/react": "^18.3.3",
-        "@types/react-dom": "^18.3.0",
-        "react": "^18.3.1",
-        "react-dom": "^18.3.1"
-    },
-    "devDependencies": {
-        "esbuild": "^0.23.0"
+  "name": "@ptolemy2002/react-mount-effects",
+  "private": false,
+  "version": "2.0.0",
+  "type": "module",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Ptolemy2002/react-mount-effects"
+  },
+  "scripts": {
+    "dev": "npm run build && vite --port 3000",
+    "build": "tsc -b ./tsconfig.lib.json && vite build",
+    "lint": "eslint .",
+    "preview": "vite preview",
+    "postinstall": "npx typesync",
+    "uninstall": "bash ./scripts/uninstall.sh",
+    "reinstall": "bash ./scripts/reinstall.sh",
+    "release": "bash ./scripts/release.sh",
+    "release-patch": "bash ./scripts/release.sh patch",
+    "release-minor": "bash ./scripts/release.sh minor",
+    "release-major": "bash ./scripts/release.sh major"
+  },
+  "peerDependencies": {
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.11.1",
+    "@types/babel__generator": "^7.6.8",
+    "@types/babel__template": "^7.4.4",
+    "@types/babel__traverse": "^7.20.6",
+    "@types/eslint__js": "~8.42.3",
+    "@types/is-callable": "~1.1.2",
+    "@types/less": "~3.0.6",
+    "@types/node": "^22.7.4",
+    "@types/prop-types": "^15.7.13",
+    "@types/react": "^18.3.10",
+    "@types/react-dom": "^18.3.0",
+    "@vitejs/plugin-react": "^4.3.2",
+    "eslint": "^9.11.1",
+    "eslint-plugin-react": "^7.37.1",
+    "eslint-plugin-react-hooks": "^5.1.0-rc.0",
+    "eslint-plugin-react-refresh": "^0.4.12",
+    "globals": "^15.9.0",
+    "less": "^4.2.0",
+    "path": "^0.12.7",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "typescript": "^5.5.3",
+    "typescript-eslint": "^8.7.0",
+    "vite": "^5.4.8",
+    "vite-plugin-dts": "^4.2.3"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/lib/main.d.ts",
+      "default": "./dist/main.js"
     }
+  },
+  "files": [
+    "dist"
+  ]
 }

package/index.js

@@ -1,42 +0,0 @@
-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.js
-var src_exports = {};
-__export(src_exports, {
-  useDelayedEffect: () => useDelayedEffect,
-  useMountEffect: () => useMountEffect,
-  useUnmountEffect: () => useUnmountEffect
-});
-module.exports = __toCommonJS(src_exports);
-var import_react = require("react");
-function useMountEffect(callback) {
-  (0, import_react.useEffect)(() => {
-    callback();
-  }, []);
-}
-function useUnmountEffect(callback) {
-  (0, import_react.useEffect)(() => callback, []);
-}
-function useDelayedEffect(callback, deps = [], delay = 0) {
-  const changeCount = (0, import_react.useRef)(0);
-  (0, import_react.useEffect)(() => {
-    changeCount.current++;
-    if (changeCount.current > delay + 1) callback(changeCount, () => changeCount.current = 0);
-  }, deps);
-}