mui / mui/base-ui

[scroll area] Prop to disable custom scrollbars on mobile (iOS/Android)

Open
#3,185 0 comments 0 reactions 0 assignees View on GitHub
component: scroll area mobile type: enhancement
Dominant language
TypeScript
Stars
10.9k
Forks
543
Avg merge
1d 20h
Merged PRs (30d)
101

Description

# Feature request

## Summary

Scroll Area currently disables native scrollbars on mobile, so the styles are consistent everywhere.

On iOS, the Scroll Area's scrollbars lack the rubber band effect (though this could potentially be tweaked given the scroll area component disables it intentionally to fix some issues), and the `transform` updates are pretty laggy on iOS due to heavily async scroll events.

Since mobile scrollbars are already optimized and don't look bad, we can add an option to disable custom scrollbars on iOS & Android specifically.

## Motivation

The scrollbars on the [Dialog examples](https://master--base-ui.netlify.app/react/components/dialog#outside-scroll-dialog) feel worse than the native scrollbars on iOS due to the aforementioned issues (no rubber band, laggy transform updates)

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.