Module: custom-scrollbars
Table of contents
Functions
Functions
CustomScrollbars
▸ CustomScrollbars(props): ReactNode
CustomScrollbars is a component that encapsulates the react-custom-scrollbars library,
providing a stylized scrollbar experience. It uses Material UI's Joy styling system to
apply custom styles, including a hidden default scrollbar track to enforce the custom styles.
The scrollbar automatically hides when inactive and supports universal rendering environments, making it suitable for both client and server-side rendering scenarios. The thumb of the scrollbar (the draggable element within the scrollbar's track) is also styled according to the theme specified in the Material UI theme provider.
Parameters
| Name | Type | Description |
|---|---|---|
props | RefAttributes<any> | The props passed to the CustomScrollbars component. |
Returns
ReactNode
Example
<CustomScrollbars style={{ height: 300 }}>
<div>Scrollable content here</div>
</CustomScrollbars>This example sets a fixed height for the scrollbar area and includes some content that exceeds the height of the container, making the scrollbar functional.
Defined in
node_modules/@captn/joy/dist/esm/custom-scrollbars/index.js:38
node_modules/@captn/joy/dist/esm/custom-scrollbars/index.js:45