@restart/hooks - npm Package Compare versions

Comparing version 0.2.3 to 0.2.5

es/useImage.d.ts

@@ -5,3 +5,3 @@ declare type State = {
 };
-export default function useImage(url: string, crossOrigin?: string): State;
+export default function useImage(imageOrUrl: string | HTMLImageElement, crossOrigin?: string): State;
 export {};

es/useImage.js

@@ -8,3 +8,3 @@ "use strict";
 
-function useImage(url, crossOrigin) {
+function useImage(imageOrUrl, crossOrigin) {
   var _useState = (0, _react.useState)({
@@ -18,7 +18,21 @@ image: null,
   (0, _react.useEffect)(function () {
-    if (!url) return undefined;
-    var image = new Image();
-    image.src = url;
-    if (crossOrigin) image.crossOrigin = crossOrigin;
+    if (!imageOrUrl) return undefined;
+    var image;
 
+    if (typeof imageOrUrl === 'string') {
+      image = new Image();
+      image.src = imageOrUrl;
+      if (crossOrigin) image.crossOrigin = crossOrigin;
+    } else {
+      image = imageOrUrl;
+
+      if (image.complete && image.naturalHeight > 0) {
+        setState({
+          image: image,
+          error: null
+        });
+        return;
+      }
+    }
+
     function onLoad() {
@@ -44,4 +58,4 @@ setState({
     };
-  }, [url, crossOrigin]);
+  }, [imageOrUrl, crossOrigin]);
   return state;
 }

package.json

 {
   "name": "@restart/hooks",
-  "version": "0.2.3",
+  "version": "0.2.5",
   "main": "index.js",
@@ -5,0 +5,0 @@ "types": "index.d.ts",

README.md

@@ -1,6 +0,5 @@
-# react-common-hooks
+# @restart/hooks [![npm][npm-badge]][npm]
 
-A set of utility and general purpose react hooks
+A set of utility and general-purpose React hooks.
 
-
 ## Install
@@ -18,4 +17,5 @@
 useInterval(() => loop(), false, 300)
-
 ```
 
+[npm-badge]: https://img.shields.io/npm/v/@restart/hooks.svg
+[npm]: https://www.npmjs.org/package/@restart/hooks

useImage.d.ts

@@ -5,3 +5,3 @@ declare type State = {
 };
-export default function useImage(url: string, crossOrigin?: string): State;
+export default function useImage(imageOrUrl: string | HTMLImageElement, crossOrigin?: string): State;
 export {};

useImage.js

@@ -8,3 +8,3 @@ "use strict";
 
-function useImage(url, crossOrigin) {
+function useImage(imageOrUrl, crossOrigin) {
   var _useState = (0, _react.useState)({
@@ -18,7 +18,21 @@ image: null,
   (0, _react.useEffect)(function () {
-    if (!url) return undefined;
-    var image = new Image();
-    image.src = url;
-    if (crossOrigin) image.crossOrigin = crossOrigin;
+    if (!imageOrUrl) return undefined;
+    var image;
 
+    if (typeof imageOrUrl === 'string') {
+      image = new Image();
+      image.src = imageOrUrl;
+      if (crossOrigin) image.crossOrigin = crossOrigin;
+    } else {
+      image = imageOrUrl;
+
+      if (image.complete && image.naturalHeight > 0) {
+        setState({
+          image: image,
+          error: null
+        });
+        return;
+      }
+    }
+
     function onLoad() {
@@ -44,4 +58,4 @@ setState({
     };
-  }, [url, crossOrigin]);
+  }, [imageOrUrl, crossOrigin]);
   return state;
 }

No alert changes

Improved metrics

Total package byte prevSize

25669

3.07%

Lines of code

572

4.38%

No dependency changes