Closed elringus closed 10 months ago
@Elringus Thanks for the report!
I'll create an fix, but out of curiosity I would like to know why the NaN
value is created (probably division by 0 or something) but I can't trigger it in my tests.
Here's how I use the plugin:
export const Scrollable = (props: Props) => {
const ref = useRef<HTMLDivElement>(null);
const { children, scrollX, scrollY, container, className } = props;
const [initialize, getInstance] = useOverlayScrollbars({
options: {
overflow: {
x: scrollX == null ? "scroll" : scrollX ? "scroll" : "hidden",
y: scrollY == null ? "scroll" : scrollY ? "scroll" : "hidden"
},
scrollbars: { clickScroll: true }
},
defer: false
});
useEffect(() => {
if (ref.current != null) {
if (container == null) initialize(ref.current);
else initialize({ target: ref.current, elements: { viewport: container } });
}
return () => getInstance()?.destroy();
}, [container, initialize, getInstance]);
return <div {...props}
ref={ref}
children={children}
className={c(css.scrollable, className)}
data-overlayscrollbars=""/>;
};
I've noticed the warning is only triggered when I use the <Scrollable>
for a virtual list (via virtuoso) and only when return () => getInstance()?.destroy();
is present. When the destructor is removed, the warning is gone (but also styling breaks, not sure why).
Can confirm https://github.com/KingSora/OverlayScrollbars/commit/edc677f55c618eba2f9331a67b0e320112d02517 fixes the warnings.
I've tried making a minimal repro with just OverlayScrollbars and Virtuoso, but it didn't reproduce. It's probably more complicated.
@Elringus great! I'll publish a new version soon
After an update to the latest version of the react package I've started getting following warnings:
— I guess it should be an easy fix by just guarding against nan, but if you need a repro, I'll try to make one.