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.
52 lines
1.2 KiB
52 lines
1.2 KiB
import React, { forwardRef, ReactNode, useCallback } from 'react';
|
|
import Scroller from 'Components/Scroller/Scroller';
|
|
import ScrollDirection from 'Helpers/Props/ScrollDirection';
|
|
import { isLocked } from 'Utilities/scrollLock';
|
|
import styles from './PageContentBody.css';
|
|
|
|
interface PageContentBodyProps {
|
|
className: string;
|
|
innerClassName: string;
|
|
children: ReactNode;
|
|
initialScrollTop?: number;
|
|
onScroll?: (payload) => void;
|
|
}
|
|
|
|
const PageContentBody = forwardRef(
|
|
(
|
|
props: PageContentBodyProps,
|
|
ref: React.MutableRefObject<HTMLDivElement>
|
|
) => {
|
|
const {
|
|
className = styles.contentBody,
|
|
innerClassName = styles.innerContentBody,
|
|
children,
|
|
onScroll,
|
|
...otherProps
|
|
} = props;
|
|
|
|
const onScrollWrapper = useCallback(
|
|
(payload) => {
|
|
if (onScroll && !isLocked()) {
|
|
onScroll(payload);
|
|
}
|
|
},
|
|
[onScroll]
|
|
);
|
|
|
|
return (
|
|
<Scroller
|
|
ref={ref}
|
|
{...otherProps}
|
|
className={className}
|
|
scrollDirection={ScrollDirection.Vertical}
|
|
onScroll={onScrollWrapper}
|
|
>
|
|
<div className={innerClassName}>{children}</div>
|
|
</Scroller>
|
|
);
|
|
}
|
|
);
|
|
|
|
export default PageContentBody;
|