@rescui/use-resize-observer 0.2.4 → 0.2.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/use-resize-observer.js +14 -12
- package/package.json +4 -5
|
@@ -1,18 +1,20 @@
|
|
|
1
1
|
import { useRef, useEffect } from 'react';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
const useResizeObserver = function (target, callback) {
|
|
4
|
+
let options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
|
|
5
5
|
ignoreFirstCall: false
|
|
6
6
|
};
|
|
7
|
-
|
|
7
|
+
const cb = useRef();
|
|
8
8
|
cb.current = callback;
|
|
9
|
-
|
|
10
|
-
|
|
9
|
+
const {
|
|
10
|
+
ignoreFirstCall
|
|
11
|
+
} = options;
|
|
12
|
+
useEffect(() => {
|
|
11
13
|
if (!target) {
|
|
12
14
|
return;
|
|
13
15
|
}
|
|
14
16
|
|
|
15
|
-
|
|
17
|
+
let targetEl;
|
|
16
18
|
|
|
17
19
|
if ('current' in target) {
|
|
18
20
|
targetEl = target.current;
|
|
@@ -24,16 +26,16 @@ var useResizeObserver = function useResizeObserver(target, callback) {
|
|
|
24
26
|
return;
|
|
25
27
|
}
|
|
26
28
|
|
|
27
|
-
|
|
28
|
-
|
|
29
|
+
let firstCall = true;
|
|
30
|
+
let abort = false; // eslint-disable-next-line complexity
|
|
29
31
|
|
|
30
|
-
|
|
32
|
+
const onResize = entries => {
|
|
31
33
|
// on the first call, delay it by a frame, see https://stackoverflow.com/a/58701523
|
|
32
34
|
if (firstCall) {
|
|
33
35
|
firstCall = false;
|
|
34
36
|
|
|
35
37
|
if (!ignoreFirstCall) {
|
|
36
|
-
window.requestAnimationFrame(
|
|
38
|
+
window.requestAnimationFrame(() => {
|
|
37
39
|
onResize(entries);
|
|
38
40
|
});
|
|
39
41
|
}
|
|
@@ -50,10 +52,10 @@ var useResizeObserver = function useResizeObserver(target, callback) {
|
|
|
50
52
|
}
|
|
51
53
|
};
|
|
52
54
|
|
|
53
|
-
|
|
55
|
+
const resizeObserver = new ResizeObserver(onResize);
|
|
54
56
|
resizeObserver.observe(targetEl); // eslint-disable-next-line consistent-return
|
|
55
57
|
|
|
56
|
-
return
|
|
58
|
+
return () => {
|
|
57
59
|
abort = true;
|
|
58
60
|
resizeObserver.disconnect();
|
|
59
61
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rescui/use-resize-observer",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.5",
|
|
4
4
|
"description": "ResizeObserver hook",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "JetBrains",
|
|
@@ -14,18 +14,17 @@
|
|
|
14
14
|
"access": "public"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@babel/runtime-corejs3": "^7.
|
|
18
|
-
"core-js": "^3.9.1"
|
|
17
|
+
"@babel/runtime-corejs3": "^7.26.0"
|
|
19
18
|
},
|
|
20
19
|
"peerDependencies": {
|
|
21
20
|
"react": ">=16.8.0 <19"
|
|
22
21
|
},
|
|
23
22
|
"devDependencies": {
|
|
24
|
-
"@rescui/scripts": "^0.3.
|
|
23
|
+
"@rescui/scripts": "^0.3.5"
|
|
25
24
|
},
|
|
26
25
|
"scripts": {
|
|
27
26
|
"build": "rescui-scripts build"
|
|
28
27
|
},
|
|
29
28
|
"nx": {},
|
|
30
|
-
"gitHead": "
|
|
29
|
+
"gitHead": "67627f69be3de4b4c6a21244fd7de36e841f01f0"
|
|
31
30
|
}
|