A small wrapper around react-scrollbars-custom to give it autohiding scrollbars

Scrollbar.jsx

import React, { useState } from 'react';
import RSC from 'react-scrollbars-custom';

export default ({ autoHide, children, ...props }) => {
  const [inUse, setInUse] = useState();
  const style = { style: autoHide && { display: inUse ? null : 'none' }};
  
  return <RSC
    trackXProps={style}
    trackYProps={style}
    onMouseEnter={autoHide && (() => setInUse(true))}
    onMouseLeave={autoHide && (() => setInUse(false))}
    {...props}
  >{children}</RSC>;
};

// <Scrollbar autoHide noScrollX>Content!</Scrollbar>

You're a life saver.