@gpa-gemstone/helper-functions
Version:
Helper Functions for gpa-gemstone packages
97 lines (96 loc) • 5.17 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.useGetContainerPosition = void 0;
// ******************************************************************************************************
// useGetContainerPosition.tsx - Gbtc
//
// Copyright © 2023, Grid Protection Alliance. All Rights Reserved.
//
// Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
// the NOTICE file distributed with this work for additional information regarding copyright ownership.
// The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
// file except in compliance with the License. You may obtain a copy of the License at:
//
// http://opensource.org/licenses/MIT
//
// Unless agreed to in writing, the subject software distributed under the License is distributed on an
// "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
// License for the specific language governing permissions and limitations.
//
// Code Modification History:
// ----------------------------------------------------------------------------------------------------
// 09/24/2024 - Preston Crawford
// Generated original version of source code.
//
// ******************************************************************************************************
var React = require("react");
/**
*
* @param {React.MutableRefObject<HTMLDivElement | null>} containerRef - A mutable reference object to the container element.
* @returns {{ top: number, left: number, height: number, width: number, x: number, y: number, bottom: number, right: number }} -
* - `top`: Distance from the top of the viewport to the top of the container.
* - `left`: Distance from the left of the viewport to the left of the container.
* - `height`: Height of the container.
* - `width`: Width of the container.
* - `scrollWidth`: Scroll Width of the container.
* - `x`: Horizontal position of the container relative to the viewport.
* - `y`: Vertical position of the container relative to the viewport.
* - `bottom`: Distance from the top of the viewport to the bottom of the container.
* - `right`: Distance from the left of the viewport to the right of the container.
*/
var useGetContainerPosition = function (containerRef) {
var _a = React.useState(0), top = _a[0], setTop = _a[1];
var _b = React.useState(0), left = _b[0], setLeft = _b[1];
var _c = React.useState(0), height = _c[0], setHeight = _c[1];
var _d = React.useState(0), scrollHeight = _d[0], setScrollHeight = _d[1];
var _e = React.useState(0), clientHeight = _e[0], setClientHeight = _e[1];
var _f = React.useState(0), width = _f[0], setWidth = _f[1];
var _g = React.useState(0), scrollWidth = _g[0], setScrollWidth = _g[1];
var _h = React.useState(0), clientWidth = _h[0], setClientWidth = _h[1];
var _j = React.useState(0), x = _j[0], setX = _j[1];
var _k = React.useState(0), y = _k[0], setY = _k[1];
var _l = React.useState(0), bottom = _l[0], setBottom = _l[1];
var _m = React.useState(0), right = _m[0], setRight = _m[1];
React.useLayoutEffect(function () {
if (containerRef.current == null)
return;
var handleResize = function () {
if (containerRef.current == null)
return;
var newSize = containerRef.current.getBoundingClientRect();
var newScrollWidth = containerRef.current.scrollWidth;
if (newSize.top !== top)
setTop(newSize.top);
if (newSize.left !== left)
setLeft(newSize.left);
if (newSize.height !== height)
setHeight(newSize.height);
if (containerRef.current.scrollHeight !== scrollHeight)
setScrollHeight(containerRef.current.scrollHeight);
if (containerRef.current.clientHeight !== clientHeight)
setClientHeight(containerRef.current.clientHeight);
if (newSize.width !== width)
setWidth(newSize.width);
if (newScrollWidth !== scrollWidth)
setScrollWidth(newScrollWidth);
if (clientWidth !== containerRef.current.clientWidth)
setClientWidth(containerRef.current.clientWidth);
if (newSize.x !== x)
setX(newSize.x);
if (newSize.y !== y)
setY(newSize.y);
if (newSize.bottom !== bottom)
setBottom(newSize.bottom);
if (newSize.right !== right)
setRight(newSize.right);
};
var resizeObserver = new ResizeObserver(handleResize);
resizeObserver.observe(containerRef.current);
handleResize();
return function () {
resizeObserver.disconnect();
};
});
return { top: top, left: left, height: height, width: width, x: x, y: y, bottom: bottom, right: right, scrollWidth: scrollWidth, clientWidth: clientWidth, scrollHeight: scrollHeight, clientHeight: clientHeight };
};
exports.useGetContainerPosition = useGetContainerPosition;