You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Sonarr/frontend/src/Components/Page/PageContentBody.tsx

48 lines
1.2 KiB

import React, { ForwardedRef, forwardRef, ReactNode, useCallback } from 'react';
import Scroller, { OnScroll } from 'Components/Scroller/Scroller';
import { isLocked } from 'Utilities/scrollLock';
import styles from './PageContentBody.css';
interface PageContentBodyProps {
className?: string;
innerClassName?: string;
children: ReactNode;
initialScrollTop?: number;
onScroll?: (payload: OnScroll) => void;
}
const PageContentBody = forwardRef(
(props: PageContentBodyProps, ref: ForwardedRef<HTMLDivElement>) => {
const {
className = styles.contentBody,
innerClassName = styles.innerContentBody,
children,
onScroll,
...otherProps
} = props;
const onScrollWrapper = useCallback(
(payload: OnScroll) => {
if (onScroll && !isLocked()) {
onScroll(payload);
}
},
[onScroll]
);
return (
<Scroller
ref={ref}
{...otherProps}
className={className}
scrollDirection="vertical"
onScroll={onScrollWrapper}
>
<div className={innerClassName}>{children}</div>
</Scroller>
);
}
);
export default PageContentBody;