Skip to content

Commit 484fcb2

Browse files
authored
Update README.md
1 parent f28f80b commit 484fcb2

File tree

1 file changed

+14
-4
lines changed

1 file changed

+14
-4
lines changed

README.md

+14-4
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
🚧 At this stage, this project is not unit-tested but works as expected. Minor optimizations are planned. Use with caution. 🚧
2-
31
# autoscroll-react
42

53
Autoscroll a react component
@@ -23,7 +21,7 @@ class MyList extends React.Component {
2321
render(){
2422
const { items, ...props } = this.props
2523
return (
26-
<ul { ...props } >{ // You MUST pass down props
24+
<ul { ...props } >{ // ⚠️ You MUST pass down props ⚠️
2725
items.map(
2826
item => <Item
2927
key={ item.id }
@@ -41,7 +39,19 @@ export default Autoscroll(MyList)
4139
`Autoscroll(Component)`: returns the passed component without any additional markup.
4240
It scrolls the root node rendered by the component to the bottom whenever it updates, but not if the user has scrolled up.
4341

44-
⚠️ You must Explicitly pass down props to the wrapped component. ⚠️
42+
## ⚠️ caveats ⚠️
43+
44+
- You must Explicitly pass down props to the wrapped component. This is so an event listener can be attached. This means you can also pass down your own props to the wrapped component
45+
- The wrapped component must be a Class-based component, not a functional one, because `Autoscroll` uses a `ref`.
46+
- This package is agnostic about any CSS you use. However., it requires that you provide the adequate CSS to make the wrapped component have a scroll bar. (ie. `overflow-y:scroll;` and a set `height`)
47+
48+
## options
49+
50+
`Autoscroll(Component, { isScrolledDownThreshold: 150 /*default*/})`
51+
52+
The `isScrolledDownThreshold` option is used when determining whether the user has scrolled back to the bottom. If the element's `scrollBottom` is within `isScrolledDownThreshold`px of the maximum scroll (`scrollHeight`), the component will scroll down on the next updates.
53+
This option exists because scrolling almost all the way down, but not entirely, can be interpreted as a sign that the user intends to see the bottom of the list.
54+
4555

4656
## Build
4757

0 commit comments

Comments
 (0)