React Native MantineMiscellaneous

ScrollArea

Scrollable container with Mantine-compatible API

Import: import { ScrollArea } from 'react-native-mantine';

Usage

import { ScrollArea } from 'react-native-mantine';

// Fixed-height vertical scroll area
<ScrollArea style={{ height: 160 }}>
  {/* long content */}
</ScrollArea>

// Horizontal scrolling without indicators
<ScrollArea horizontal type="never">
  {/* wide content */}
</ScrollArea>

// Grows with content up to maxHeight
<ScrollArea.Autosize maxHeight={120}>
  {/* content */}
</ScrollArea.Autosize>

// Track the scroll offset
<ScrollArea
  style={{ height: 160 }}
  onScrollPositionChange={({ x, y }) => console.log(x, y)}
>
  {/* content */}
</ScrollArea>

Props

PropTypeDefaultDescription
maxHeight (required)numberMaximum height of the scroll area, content grows naturally until it exceeds this value and becomes scrollable

Source on GitHub · npm