1 | "use strict";
|
2 |
|
3 | exports.__esModule = true;
|
4 | exports.default = useResizeObserver;
|
5 | var _react = require("react");
|
6 | var _useIsomorphicEffect = _interopRequireDefault(require("./useIsomorphicEffect"));
|
7 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
8 | const targetMap = new WeakMap();
|
9 | let resizeObserver;
|
10 | function getResizeObserver() {
|
11 |
|
12 | return resizeObserver = resizeObserver || new window.ResizeObserver(entries => {
|
13 | entries.forEach(entry => {
|
14 | const handler = targetMap.get(entry.target);
|
15 | if (handler) handler(entry.contentRect);
|
16 | });
|
17 | });
|
18 | }
|
19 |
|
20 |
|
21 |
|
22 |
|
23 |
|
24 |
|
25 |
|
26 |
|
27 |
|
28 |
|
29 |
|
30 |
|
31 |
|
32 |
|
33 |
|
34 |
|
35 |
|
36 |
|
37 |
|
38 | function useResizeObserver(element) {
|
39 | const [rect, setRect] = (0, _react.useState)(null);
|
40 | (0, _useIsomorphicEffect.default)(() => {
|
41 | if (!element) return;
|
42 | getResizeObserver().observe(element);
|
43 | setRect(element.getBoundingClientRect());
|
44 | targetMap.set(element, rect => {
|
45 | setRect(rect);
|
46 | });
|
47 | return () => {
|
48 | targetMap.delete(element);
|
49 | };
|
50 | }, [element]);
|
51 | return rect;
|
52 | } |
\ | No newline at end of file |