diff --git a/src/__stories__/useMeasure.story.tsx b/src/__stories__/useMeasure.story.tsx
new file mode 100644
index 00000000..c91fa18b
--- /dev/null
+++ b/src/__stories__/useMeasure.story.tsx
@@ -0,0 +1,27 @@
+import { storiesOf } from '@storybook/react';
+import React from 'react';
+import { useMeasure } from '..';
+import ShowDocs from './util/ShowDocs';
+
+const Demo = () => {
+ const [ref, { width, height }] = useMeasure();
+
+ return (
+ <>
+
width: {width}
+ height: {height}
+
+ resize me
+
+ >
+ );
+};
+
+storiesOf('Sensors|useMeasure', module)
+ .add('Docs', () => )
+ .add('Demo', () => );
diff --git a/src/index.ts b/src/index.ts
index 644f587e..ec66b1b7 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -85,3 +85,4 @@ export { default as useVideo } from './useVideo';
export { useWait, Waiter } from './useWait';
export { default as useWindowScroll } from './useWindowScroll';
export { default as useWindowSize } from './useWindowSize';
+export { default as useMeasure } from './useMeasure';
diff --git a/src/useMeasure.ts b/src/useMeasure.ts
index 6a68d015..8e0d82bf 100644
--- a/src/useMeasure.ts
+++ b/src/useMeasure.ts
@@ -1,6 +1,5 @@
import { useCallback, useState } from 'react';
import ResizeObserver from 'resize-observer-polyfill';
-
export interface ContentRect {
width: number;
height: number;
@@ -23,7 +22,9 @@ const useMeasure = (): [(instance: T) => void, ContentRect] => {
() =>
new ResizeObserver(entries => {
const entry = entries[0];
- set(entry.contentRect);
+ if (entry) {
+ set(entry.contentRect);
+ }
})
);