ScrollArea

ScrollArea gives a scrollable region a consistent, styled scrollbar across browsers, without disabling native keyboard scrolling.

Usage

import { ScrollArea } from "@sina-design-system/core";

<ScrollArea style={{ height: 240 }}>
  {/* long content */}
</ScrollArea>

Examples

Chip 1   ·   Chip 2   ·   Chip 3   ·   Chip 4   ·   Chip 5   ·   Chip 6   ·   Chip 7   ·   Chip 8   ·   Chip 9   ·   Chip 10   ·   Chip 11   ·   Chip 12   ·   Chip 13   ·   Chip 14   ·   Chip 15   ·   Chip 16

Accessibility

Use it for a bounded list or panel that would otherwise overflow. Content stays keyboard-scrollable and the scrollbar doesn't shift layout.