react-use-measure - npm Package Compare versions

Comparing version 1.0.3 to 1.0.4

.size-snapshot.json

 {
   "dist/web.js": {
-    "bundled": 1065,
-    "minified": 613,
-    "gzipped": 350,
+    "bundled": 1117,
+    "minified": 621,
+    "gzipped": 358,
     "treeshaked": {
@@ -17,6 +17,6 @@ "rollup": {
   "dist/web.cjs.js": {
-    "bundled": 1492,
-    "minified": 677,
-    "gzipped": 377
+    "bundled": 1544,
+    "minified": 685,
+    "gzipped": 385
   }
 }

dist/web.cjs.js

@@ -5,4 +5,4 @@ 'use strict';
 
-function useMeasure() {
-  var ref = react.useRef(null);
+function useMeasure(maybeRef) {
+  var ref = maybeRef || react.useRef(null);
 
@@ -67,5 +67,6 @@ var _useState = react.useState({
   }, []);
-  return [ref, bounds];
+  if (!maybeRef) return [ref, bounds];
+  return bounds;
 }
 
 module.exports = useMeasure;

dist/web.js

 import { useRef, useState, useEffect } from 'react';
 
-function useMeasure() {
-  const ref = useRef(null);
+function useMeasure(maybeRef) {
+  const ref = maybeRef || useRef(null);
   const [bounds, set] = useState({
@@ -54,5 +54,6 @@ left: 0,
   }, []);
-  return [ref, bounds];
+  if (!maybeRef) return [ref, bounds];
+  return bounds;
 }
 
 export default useMeasure;

package.json

 {
   "name": "react-use-measure",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "measure view bounds",
@@ -5,0 +5,0 @@ "main": "./dist/web.cjs.js",

readme.md

@@ -27,3 +27,3 @@ npm install resize-observer-polyfill react-use-measure
 const ref = useRef()
-const [, bounds] = useMeasure(ref)
+const bounds = useMeasure(ref)
 return <div ref={ref} />
@@ -30,0 +30,0 @@ ```

src/web/index.ts

@@ -42,6 +42,9 @@ import { useRef, useEffect, useState } from 'react'
 
-type Measure = [React.MutableRefObject<HTMLDivElement | null>, RectReadOnly]
+type Ref = React.MutableRefObject<HTMLElement | null>
+type Result = [Ref, RectReadOnly]
 
-export default function useMeasure(): Measure {
-  const ref = useRef<HTMLDivElement>(null)
+function useMeasure(): Result
+function useMeasure(ref: Ref): RectReadOnly
+function useMeasure(maybeRef?: Ref): Result | RectReadOnly {
+  const ref = maybeRef || useRef<HTMLElement>(null)
   const [bounds, set] = useState<RectReadOnly>({
@@ -78,3 +81,6 @@ left: 0,
   }, [])
-  return [ref, bounds]
+  if (!maybeRef) return [ref, bounds]
+  return bounds
 }
+
+export default useMeasure

types/index.d.ts

@@ -26,4 +26,6 @@ /// <reference types="react" />
 }
-declare type Measure = [React.MutableRefObject<HTMLDivElement | null>, RectReadOnly]
-export default function useMeasure(): Measure
-export {}
+declare type Ref = React.MutableRefObject<HTMLElement | null>
+declare type Result = [Ref, RectReadOnly]
+declare function useMeasure(): Result
+declare function useMeasure(ref: Ref): RectReadOnly
+export default useMeasure

No alert changes

Improved metrics

Total package byte prevSize

12469

increased by2.84%

Lines of code

308

increased by3.01%

No dependency changes