react-timing-hooks - npm Package Compare versions

Comparing version 0.1.0-alpha.2 to 0.1.0-alpha.3

CHANGELOG.md

@@ -5,2 +5,9 @@ # Changelog
 
+## [0.1.0-alpha.3](https://github.com/EricLambrecht/react-timing-hooks/compare/v0.1.0-alpha.2...v0.1.0-alpha.3) (2019-11-07)
+
+
+### Features
+
+* Added hook "useIdleCallbackEffect" ([b166e8f](https://github.com/EricLambrecht/react-timing-hooks/commit/b166e8f28274d9b29d3cbc9d23dadd6fbefa2c56))
+
 ## [0.1.0-alpha.2](https://github.com/EricLambrecht/react-timing-hooks/compare/v0.1.0-alpha.1...v0.1.0-alpha.2) (2019-11-07)
@@ -7,0 +14,0 @@

dist/index.d.ts

@@ -1,3 +0,4 @@
-import useTimeoutEffect from './useTimeoutEffect'
-import useInterval from './useInterval'
-export { useTimeoutEffect, useInterval }
+import useTimeoutEffect from './useTimeoutEffect';
+import useInterval from './useInterval';
+import useIdleCallbackEffect from './idle-callback/useIdleCallbackEffect';
+export { useTimeoutEffect, useInterval, useIdleCallbackEffect };

dist/index.js

@@ -10,3 +10,3 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     else if (typeof define === "function" && define.amd) {
-        define(["require", "exports", "./useTimeoutEffect", "./useInterval"], factory);
+        define(["require", "exports", "./useTimeoutEffect", "./useInterval", "./idle-callback/useIdleCallbackEffect"], factory);
     }
@@ -20,3 +20,5 @@ })(function (require, exports) {
     exports.useInterval = useInterval_1.default;
+    const useIdleCallbackEffect_1 = __importDefault(require("./idle-callback/useIdleCallbackEffect"));
+    exports.useIdleCallbackEffect = useIdleCallbackEffect_1.default;
 });
 //# sourceMappingURL=index.js.map

dist/types.d.ts

@@ -1,8 +0,3 @@
-export declare type TimeoutCreator = (
-  handler: () => unknown,
-  timeout: number
-) => any
-export declare type TimeoutEffectCallback = (
-  timeoutFunc: TimeoutCreator
-) => void | (() => void | undefined)
-export declare type IntervalCallback = () => unknown
+export declare type TimeoutCreator = (handler: () => unknown, timeout: number) => any;
+export declare type TimeoutEffectCallback = (timeoutFunc: TimeoutCreator) => void | (() => void | undefined);
+export declare type IntervalCallback = () => unknown;

dist/useInterval.d.ts

@@ -1,2 +0,2 @@
-import { IntervalCallback } from './types'
+import { IntervalCallback } from './types';
 /**
@@ -9,6 +9,3 @@ * This hook was inspired by Dan Abramov's blogpost:
  */
-declare const useInterval: (
-  callback: IntervalCallback,
-  delay: number | null
-) => void
-export default useInterval
+declare const useInterval: (callback: IntervalCallback, delay: number | null) => void;
+export default useInterval;

dist/useTimeoutEffect.d.ts

@@ -1,6 +0,3 @@
-import { TimeoutEffectCallback } from './types'
-declare const useTimeoutEffect: (
-  effect: TimeoutEffectCallback,
-  deps: readonly any[]
-) => void
-export default useTimeoutEffect
+import { TimeoutEffectCallback } from './types';
+declare const useTimeoutEffect: (effect: TimeoutEffectCallback, deps: readonly any[]) => void;
+export default useTimeoutEffect;

package.json

 {
   "name": "react-timing-hooks",
-  "version": "0.1.0-alpha.2",
+  "version": "0.1.0-alpha.3",
   "description": "React hooks for creating timing-related effects (setTimeout, setInterval, requestAnimationFrame, requestIdleCallback)",
@@ -40,2 +40,3 @@ "main": "dist/index.js",
   "devDependencies": {
+    "@shopify/jest-dom-mocks": "^2.8.5",
     "@testing-library/react": "^9.3.0",
@@ -50,2 +51,3 @@ "@testing-library/react-hooks": "^3.1.0",
     "jest": "^24.9.0",
+    "node-fetch": "^2.6.0",
     "prettier": "1.18.2",
@@ -52,0 +54,0 @@ "react": "^16.8.6",

README.md

@@ -8,2 +8,4 @@ # react-timing-hooks
 
+**This package is still in alpha. It is not yet feature complete.** 
+
 #### TL;DR
@@ -15,2 +17,4 @@
 
+See [docs](#Documentation)
+
 ## Examples
@@ -64,4 +68,3 @@
 
-**Note**: At this moment, `useIntervalEffect`, and hooks for `requestAnimationFrame` and `requestIdleCallback`
-are still in development.
+**Note**: A hook for `requestAnimationFrame` and an interval-versions of `requestIdleCallback` is still in development
 
@@ -78,3 +81,3 @@ ### `useTimeoutEffect(effectCallback, deps)`
 ```javascript
-// Delay the transition of a color everytime it changes
+// Delay the transition of a color by one second everytime it changes
 useTimeoutEffect(timeout => {
@@ -87,7 +90,7 @@ if (color) {
 
-### `useInterval(intervalCallback, deps)`
+### `useInterval(intervalCallback, delay)`
 
 * `intervalCallback` will be run every _[delay]_ (second arg) seconds
 
-* `delay` is the delay at which interval callback will be run. If delay is `null` the interval will be suspended.
+* `delay` is the delay at which the callback will be run. If delay is `null` the interval will be suspended.
 
@@ -101,1 +104,21 @@ Example:
 ```
+
+### `useIdleCallbackEffect(effectCallback, deps)`
+
+* `effectCallback` will receive one argument `requestIdleCallback(f, opts)` that has the
+same signature as the native [`requestIdleCallback`](https://developer.mozilla.org/en-US/docs/Web/API/Window/requestIdleCallback)
+
+* `deps` is your regular `useEffect` dependency array
+
+**Note:** This hook will print a warning if the browser doesn't support `requestIdleCallback`.
+
+Example: 
+
+```javascript
+// Track page view when browser is idle
+useIdleCallbackEffect(onIdle => {
+  if (page) {
+    onIdle(() => trackPageView(page))
+  }
+}, [page])
+```

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

19058

increased by43.02%

Number of package files

23

increased by43.75%

Lines of code

186

increased by48.8%

Number of lines in readme file

119

increased by23.96%

Worsened metrics

Dev dependency count

20

increased by11.11%

No dependency changes