1 | import canUseDOM from 'can-use-dom';
|
2 |
|
3 | let cachedScrollbarWidth = null;
|
4 | let cachedDevicePixelRatio = null;
|
5 |
|
6 | if (canUseDOM) {
|
7 | window.addEventListener('resize', () => {
|
8 | if (cachedDevicePixelRatio !== window.devicePixelRatio) {
|
9 | cachedDevicePixelRatio = window.devicePixelRatio;
|
10 | cachedScrollbarWidth = null;
|
11 | }
|
12 | });
|
13 | }
|
14 |
|
15 | export default function scrollbarWidth() {
|
16 | if (cachedScrollbarWidth === null) {
|
17 | if (typeof document === 'undefined') {
|
18 | cachedScrollbarWidth = 0;
|
19 | return cachedScrollbarWidth;
|
20 | }
|
21 |
|
22 | const body = document.body;
|
23 | const box = document.createElement('div');
|
24 |
|
25 | box.classList.add('simplebar-hide-scrollbar');
|
26 |
|
27 | body.appendChild(box);
|
28 |
|
29 | const width = box.getBoundingClientRect().right;
|
30 |
|
31 | body.removeChild(box);
|
32 |
|
33 | cachedScrollbarWidth = width;
|
34 | }
|
35 |
|
36 | return cachedScrollbarWidth;
|
37 | }
|