mui / mui/base-ui

[scroll area] Add option to keep the scroll bar always visible

Open
#2,448 2 comments 1 reaction 0 assignees View on GitHub
component: scroll area
Dominant language
TypeScript
Stars
10.9k
Forks
543
Avg merge
1d 20h
Merged PRs (30d)
101

Description

# Feature request

## Summary

When the content overflows its container, currently `ScollArea` shows a scroll bar only when the content is scroll or on focus — otherwise setting the `opacity` of the scroll bar to `0`.

The new prop could accent values such as:

- `'whenScrolling'` — current behaviour
- `'always'` — the scroll bar is always visible
- `'system'` — the scroll respects OS-level user preferences ([MacOS example](https://www.macrumors.com/how-to/make-scroll-bars-always-visible/))

## Motivation

Some users may express a preference at the OS level to keep the scrollbar always visible. Regardless, a visible scrollbar can also act as a strong hint that additional content can be revealed via scrolling.

This can currently be achieved by:
- adding logic to detect scroll overflow (#2444 )
- detect OS preferences;
- use that information to se `opacity: 1` on the scroll bar

But I believe that `ScrollArea` should support this feature natively.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.