# @synerise/ds-scrollbar

> Scrollbar UI Component for the Synerise Design System

Latest version **2.0.4** (published 2026-09-22) · ISC license · 0 weekly downloads

## Install

```sh
npm install @synerise/ds-scrollbar
pnpm add @synerise/ds-scrollbar
yarn add @synerise/ds-scrollbar
bun add @synerise/ds-scrollbar
```

## Health

**Score 55/100 (C)** — status: active.

Positive: no vulnerabilities; recently updated; high maintenance score.

Warnings: low downloads; no types; no esm support.

## Facts

| | |
|---|---|
| Version | 2.0.4 |
| Published | 2026-09-22 |
| First published | 2020-03-20 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | synerise |

## Links

- npm: https://www.npmjs.com/package/@synerise/ds-scrollbar
- Repository: Synerise/synerise-design
- npm.io page: https://npm.io/package/@synerise/ds-scrollbar

## Recent versions

- 2.0.4 (latest) — 2026-09-22
- 2.0.3 — 2026-09-18
- 2.0.2 — 2026-09-16
- 2.0.1 — 2026-09-02
- 2.0.0 — 2026-08-26
- 1.5.2 — 2026-07-23
- 1.5.1 — 2026-06-17
- 1.5.0 — 2026-06-11
- 1.4.1 — 2026-05-26
- 1.4.0 — 2026-05-22
- 1.3.5 — 2026-05-13
- 1.3.4 — 2026-05-04
- 1.3.3 — 2026-04-29
- 1.3.2 — 2026-04-28
- 1.3.1 — 2026-04-24
- … 224 more at https://npm.io/package/@synerise/ds-scrollbar/versions

## README

---
id: scrollbar
title: Scrollbar
---

Scrollbar UI Component

## Installation

```
npm i @synerise/ds-scrollbar
or
pnpm add @synerise/ds-scrollbar
```

## Usage

```
import Scrollbar from '@synerise/ds-scrollbar'

<Scrollbar />

```

## Demo

<iframe src="/storybook-static/iframe.html?id=components-scrollbar--default"></iframe>

## API

| Property      | Description                                                                      | Type                     | Default |
| ------------- | -------------------------------------------------------------------------------- | ------------------------ | ------- |
| absolute      | Whether the scrollbar is over content                                            | boolean                  | `false` |
| largeSize     | Larger scrollbar                                                                 | boolean                  | false   |
| children      | Scrolled component                                                               | React.ReactNode / string | -       |
| classes       | String with optional classes                                                     | string                   | -       |
| fetchData     | Callback called when scrollbar has been scrolled to the end in Y axis            | () => void               | -       |
| hasMore       | Whether the scrollbar can calls fetchData                                        | boolean                  | -       |
| loading       | Whether the scrollbar shows loading icon                                         | boolean                  | -       |
| maxHeight     | Optional max-height value                                                        | string / number          | -       |
| style         | Additional styles for scrollbar wrapper                                          | React.CSSProperties      | -       |
| withDnd       | Whether use DndScrollbar or VirtualScrollbar component                           | boolean                  | false   |
| onScroll      | Callback fired on scroll events                                                  | (event: UIEvent) => void | -       |
| onYReachEnd   | Callback fired independently when scroll reaches the Y end                       | () => void               | -       |
| confineScroll | Will prevent wheel event from propagating (scrolling outer scope) if set to true | boolean                  | false   |
| overscrollBehavior | CSS `overscroll-behavior` applied to the scroll container — honored by both the virtual and `withDnd` variants | `'auto' \| 'contain' \| 'none'` | `'contain'` |

---
_Source: https://npm.io/package/@synerise/ds-scrollbar · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
