@react-hook/resize-observer - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2

dist/main/index.js

 'use strict'
 
 exports.__esModule = true
-exports.useResizeObserver = void 0
+exports.default = void 0
 
@@ -110,4 +110,2 @@ var React = /*#__PURE__*/ _interopRequireWildcard(
 
-exports.useResizeObserver = useResizeObserver
-
 const createResizeObserver = () => {
@@ -130,1 +128,4 @@ const callbacks = new Set()
     : _resizeObserver
+
+var _default = useResizeObserver
+exports.default = _default

dist/module/index.js

@@ -12,3 +12,3 @@ import * as React from 'react'
 
-export const useResizeObserver = (target, callback) => {
+const useResizeObserver = (target, callback) => {
   const resizeObserver = getResizeObserver()
@@ -69,1 +69,3 @@ const targetEl = target && 'current' in target ? target.current : target
     : _resizeObserver
+
+export default useResizeObserver

package.json

 {
   "name": "@react-hook/resize-observer",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "homepage": "https://github.com/jaredLunde/react-hook/tree/master/packages/resize-observer#readme",
@@ -5,0 +5,0 @@ "repository": "github:jaredLunde/react-hook",

README.md

@@ -55,8 +55,7 @@ <hr>
 
-const MyComponent = () => {
-  const target = React.useRef(null)
-  const [{width, height}, setSize] = React.useState()
+const useSize = (target) => {
+  const [size, setSize] = React.useState()
 
-  if (!size && target.current) {
-    setSize(target.current.getBoundingClientRect())
+  if (!size && target) {
+    setSize(target.getBoundingClientRect())
   }
@@ -67,4 +66,14 @@
 
-  return <pre ref={target}>{JSON.stringify({width, height}, null, 2)</pre>}
+  return size
 }
+
+const App = () => {
+  const [target, setTarget] = React.useState(null)
+  const size = useSize(target)
+  return (
+    <pre ref={setTarget}>
+      {JSON.stringify({width: size.width, height: size.height}, null, 2)}
+    </pre>
+  )
+}
 ```
@@ -71,0 +80,0 @@

types/index.d.ts

@@ -10,3 +10,3 @@ import * as React from 'react'
  */
-export declare const useResizeObserver: <T extends HTMLElement>(
+declare const useResizeObserver: <T extends HTMLElement>(
   target: T | React.RefObject<T> | null,
@@ -19,1 +19,2 @@ callback: UseResizeObserverCallback
 ) => any
+export default useResizeObserver

No alert changes

Improved metrics

Total package byte prevSize

19230

increased by1.16%

Lines of code

314

increased by1.62%

Number of lines in readme file

109

increased by9%

No dependency changes