import { __read } from "tslib";
import { useEffect, useState } from 'react';
import { useComponentSize } from '../useComponentSize/useComponentSize';
var getMaxWidth = function (element) {
    if (element instanceof Window) {
        return element.outerWidth;
    }
    if (element instanceof Document) {
        return element.documentElement.offsetWidth;
    }
    if (element instanceof HTMLElement) {
        return element.offsetWidth;
    }
    if (element.current) {
        return element.current.offsetWidth;
    }
    return 0;
};
export var useOverflow = function (props) {
    var currentRef = props.currentRef, containerRef = props.containerRef;
    var _a = __read(useState(false), 2), isOverflow = _a[0], setIsOverflow = _a[1];
    var size = useComponentSize(currentRef);
    useEffect(function () {
        var _a;
        var container = containerRef || ((_a = currentRef.current) === null || _a === void 0 ? void 0 : _a.parentElement);
        if (container && currentRef.current) {
            var cs = container instanceof HTMLElement
                ? getComputedStyle(container)
                : {
                    paddingLeft: '0',
                    paddingTop: '0',
                    paddingBottom: '0',
                    paddingRight: '0'
                };
            var padding = {
                top: parseFloat(cs.paddingTop),
                left: parseFloat(cs.paddingLeft),
                right: parseFloat(cs.paddingRight),
                bottom: parseFloat(cs.paddingBottom)
            };
            if (getMaxWidth(container) - padding.left - padding.right < currentRef.current.scrollWidth) {
                setIsOverflow(true);
            }
            else {
                setIsOverflow(false);
            }
        }
    }, [size.width, size.height]);
    return isOverflow;
};
