57 lines
1.9 KiB
JavaScript
57 lines
1.9 KiB
JavaScript
|
'use client';
|
||
|
|
||
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
||
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
||
|
import * as React from 'react';
|
||
|
import PropTypes from 'prop-types';
|
||
|
import debounce from '../utils/debounce';
|
||
|
import { ownerWindow, unstable_useEnhancedEffect as useEnhancedEffect } from '../utils';
|
||
|
import { jsx as _jsx } from "react/jsx-runtime";
|
||
|
var styles = {
|
||
|
width: 99,
|
||
|
height: 99,
|
||
|
position: 'absolute',
|
||
|
top: -9999,
|
||
|
overflow: 'scroll'
|
||
|
};
|
||
|
|
||
|
/**
|
||
|
* @ignore - internal component.
|
||
|
* The component originates from https://github.com/STORIS/react-scrollbar-size.
|
||
|
* It has been moved into the core in order to minimize the bundle size.
|
||
|
*/
|
||
|
export default function ScrollbarSize(props) {
|
||
|
var onChange = props.onChange,
|
||
|
other = _objectWithoutProperties(props, ["onChange"]);
|
||
|
var scrollbarHeight = React.useRef();
|
||
|
var nodeRef = React.useRef(null);
|
||
|
var setMeasurements = function setMeasurements() {
|
||
|
scrollbarHeight.current = nodeRef.current.offsetHeight - nodeRef.current.clientHeight;
|
||
|
};
|
||
|
useEnhancedEffect(function () {
|
||
|
var handleResize = debounce(function () {
|
||
|
var prevHeight = scrollbarHeight.current;
|
||
|
setMeasurements();
|
||
|
if (prevHeight !== scrollbarHeight.current) {
|
||
|
onChange(scrollbarHeight.current);
|
||
|
}
|
||
|
});
|
||
|
var containerWindow = ownerWindow(nodeRef.current);
|
||
|
containerWindow.addEventListener('resize', handleResize);
|
||
|
return function () {
|
||
|
handleResize.clear();
|
||
|
containerWindow.removeEventListener('resize', handleResize);
|
||
|
};
|
||
|
}, [onChange]);
|
||
|
React.useEffect(function () {
|
||
|
setMeasurements();
|
||
|
onChange(scrollbarHeight.current);
|
||
|
}, [onChange]);
|
||
|
return /*#__PURE__*/_jsx("div", _extends({
|
||
|
style: styles,
|
||
|
ref: nodeRef
|
||
|
}, other));
|
||
|
}
|
||
|
process.env.NODE_ENV !== "production" ? ScrollbarSize.propTypes = {
|
||
|
onChange: PropTypes.func.isRequired
|
||
|
} : void 0;
|