import classnames from 'classnames';
import React__default, { useState, useRef, useCallback, useEffect } from 'react';
import { b as DATA_LIST_STICKY_HEADER_TEST_ID } from './DataList.const-es.js';

var styles = {"header":"u5YTRL-PlTI-","stuck":"rylbmDbzCts-","spinning":"_2VUVOWcGjbc-"};

function DataListStickyHeader({ children }) {
    const [isStuck, setIsStuck] = useState(false);
    const ref = useRef(null);
    const handleObserver = useCallback(([e]) => setIsStuck(e.intersectionRatio < 1), [setIsStuck]);
    useEffect(() => {
        if (!window.IntersectionObserver)
            return;
        const observer = new IntersectionObserver(handleObserver, { threshold: 1 });
        ref.current && observer.observe(ref.current);
        return () => {
            ref.current && observer.unobserve(ref.current);
        };
    }, [handleObserver, ref.current]);
    return (React__default.createElement("div", { "data-testid": DATA_LIST_STICKY_HEADER_TEST_ID, ref: ref, className: classnames(styles.header, { [styles.stuck]: isStuck }) }, children));
}

export { DataListStickyHeader as D };
