Customize width of rendered scrollbar
GREsau opened this issue · 0 comments
Is your feature request related to a problem? Please describe.
We're using react-scrollbars-custom in a very small space-constrained UI, and would find it very useful to be able to set the scrollbar's width, (or height for the horizontal track/thumb). react-scrollbars-custom currently hard-codes this to 10px.
Describe the solution you'd like
A new prop, e.g. customScrollbarWidth :number = 10
. It can't be called scrollbarWidth
because that's already used to specify the width of native scrollbar.
Describe alternatives you've considered
It may be possible to achieve this already with the available props, but I haven't found a great way to do it. I'm currently working-around this with the following (for vertical scrollbar only):
<Scrollbar
ref={scrollbarRef}
trackYProps={{ style: { width: customWidth} }}
wrapperProps={{ style: { right: scrollbarRef.current?.getScrollState().trackYVisible ? customWidth : 0 } }}
disableTrackYWidthCompensation
>
This mostly works, the main problem is the rare case when the scrollbar shows/hides without my component being rerendered - this causes the custom wrapper indent to not update.
Please let me know if you'd be open to a PR making this change