Is there any way to use max-height property for scrollbar?

[sureshsumtotal]

I'm using the react-scrollbars-custom library for my application's navigation menu. The menu height changes dynamically based on the content, but I want the scrollbar to appear only after reaching a certain maximum height. However, I couldn't find support for the max-height property. When I set the height dynamically for the scrollbar component, I notice a flickering issue where the scrollbar briefly appears and then disappears for smaller containers. Could you suggest a way to implement the max-height property for the scrollbar component without causing any flickering issues?

[hatamsoyunov]

const contentRef = useRef<HTMLDivElement>(null);
const [height, setHeight] = useState(0);

useEffect(() => {
    const observer = new ResizeObserver((entries) => {
      const newHeight = entries[0].contentRect.height;
      setHeight(newHeight);
    });

    if (contentRef.current) {
      observer.observe(contentRef.current);
    }

    return () => {
      if (contentRef.current) {
        observer.unobserve(contentRef.current);
      }
    };
  }, []);

<Scrollbar
    style={{
        height,
        maxHeight,
     }}
>
  <div ref={contentRef}>{children}</div>
</Scrollbar>