51 lines
987 B
Plaintext
51 lines
987 B
Plaintext
---
|
|
title: Scroll Progress
|
|
description: A scroll progress component that displays the progress of the scroll.
|
|
author:
|
|
name: imskyleen
|
|
url: https://github.com/imskyleen
|
|
---
|
|
|
|
<ComponentPreview name="scroll-progress-demo" />
|
|
|
|
## Installation
|
|
|
|
<ComponentInstallation name="scroll-progress" />
|
|
|
|
## Usage
|
|
|
|
### Global Scroll Progress
|
|
|
|
```tsx
|
|
<ScrollProgress />
|
|
```
|
|
|
|
### Local Scroll Progress
|
|
|
|
```tsx
|
|
<ScrollProgress progressProps={{ className: 'absolute' }}>...</ScrollProgress>
|
|
```
|
|
|
|
## Props
|
|
|
|
<TypeTable
|
|
type={{
|
|
progressProps: {
|
|
description: 'The props for the progress element',
|
|
type: 'HTMLMotionProps<"div">',
|
|
required: false,
|
|
},
|
|
className: {
|
|
description: 'The class name for the scroll progress',
|
|
type: 'string',
|
|
required: false,
|
|
},
|
|
children: {
|
|
description:
|
|
'The children for the scroll progress (if not provided, the progress will be global)',
|
|
type: 'React.ReactNode',
|
|
required: false,
|
|
},
|
|
}}
|
|
/>
|