mirror of
https://github.com/kremalicious/umami.git
synced 2024-09-27 11:48:48 +02:00
24 lines
637 B
JavaScript
24 lines
637 B
JavaScript
import { useEffect, useRef } from 'react';
|
|
import classNames from 'classnames';
|
|
import useSticky from 'hooks/useSticky';
|
|
|
|
export default function StickyHeader({ className, stickyClassName, stickyStyle, children }) {
|
|
const { ref, isSticky } = useSticky();
|
|
const initialWidth = useRef(0);
|
|
|
|
useEffect(() => {
|
|
initialWidth.current = ref.current.clientWidth;
|
|
}, [ref]);
|
|
|
|
return (
|
|
<div
|
|
ref={ref}
|
|
data-sticky={isSticky}
|
|
className={classNames(className, { [stickyClassName]: isSticky })}
|
|
style={isSticky ? { ...stickyStyle, width: initialWidth.current } : null}
|
|
>
|
|
{children}
|
|
</div>
|
|
);
|
|
}
|