main
Last change
on this file was d565449, checked in by stefan toskovski <stefantoska84@…>, 4 weeks ago |
Update repo after prototype presentation
|
-
Property mode
set to
100644
|
File size:
1.3 KB
|
Rev | Line | |
---|
[d565449] | 1 | import { useMemo, useState } from 'react';
|
---|
| 2 | import useIsomorphicLayoutEffect from './useIsomorphicLayoutEffect';
|
---|
| 3 | import { isBrowser, noop } from './misc/util';
|
---|
| 4 | var defaultState = {
|
---|
| 5 | x: 0,
|
---|
| 6 | y: 0,
|
---|
| 7 | width: 0,
|
---|
| 8 | height: 0,
|
---|
| 9 | top: 0,
|
---|
| 10 | left: 0,
|
---|
| 11 | bottom: 0,
|
---|
| 12 | right: 0,
|
---|
| 13 | };
|
---|
| 14 | function useMeasure() {
|
---|
| 15 | var _a = useState(null), element = _a[0], ref = _a[1];
|
---|
| 16 | var _b = useState(defaultState), rect = _b[0], setRect = _b[1];
|
---|
| 17 | var observer = useMemo(function () {
|
---|
| 18 | return new window.ResizeObserver(function (entries) {
|
---|
| 19 | if (entries[0]) {
|
---|
| 20 | var _a = entries[0].contentRect, x = _a.x, y = _a.y, width = _a.width, height = _a.height, top_1 = _a.top, left = _a.left, bottom = _a.bottom, right = _a.right;
|
---|
| 21 | setRect({ x: x, y: y, width: width, height: height, top: top_1, left: left, bottom: bottom, right: right });
|
---|
| 22 | }
|
---|
| 23 | });
|
---|
| 24 | }, []);
|
---|
| 25 | useIsomorphicLayoutEffect(function () {
|
---|
| 26 | if (!element)
|
---|
| 27 | return;
|
---|
| 28 | observer.observe(element);
|
---|
| 29 | return function () {
|
---|
| 30 | observer.disconnect();
|
---|
| 31 | };
|
---|
| 32 | }, [element]);
|
---|
| 33 | return [ref, rect];
|
---|
| 34 | }
|
---|
| 35 | export default isBrowser && typeof window.ResizeObserver !== 'undefined'
|
---|
| 36 | ? useMeasure
|
---|
| 37 | : (function () { return [noop, defaultState]; });
|
---|
Note:
See
TracBrowser
for help on using the repository browser.