Added navigation feature #97
Conversation
![accesslint[bot]](https://avatars.githubusercontent.com/in/1502?s=60&v=4){kind=small}
| > | ||
| <div> | ||
| <div style={{ width: "250px", height: "250px" }}> | ||
| <img style={{ maxWidth: "100%", maxHeight: "100%" }} src="https://cdn.tutsplus.com/net/uploads/2013/08/github-collab-retina-preview.gif" /> |
There was a problem hiding this comment.
This image is missing a text alternative (alt attribute). This is a problem for people using screen readers.
| > | ||
| <div> | ||
| <div style={{ width: "250px", height: "250px" }}> | ||
| <img style={{ maxWidth: "100%", maxHeight: "100%" }} src="https://cdn.tutsplus.com/net/uploads/2013/08/github-collab-retina-preview.gif" /> |
There was a problem hiding this comment.
This image is missing a text alternative (alt attribute). This is a problem for people using screen readers.
|
@highfield thanks for opening the PR. the proposal looks good to me. can you fix the lint issues please. |
|
@prabhuignoto I'd love to fix them, but I have no practice with linter. By the way, the analisys shows some strange informations to me. For instance, anonymous functions are a very common practice with React hooks: should we take all of them as named? Let me know. |
|
Kudos, SonarCloud Quality Gate passed!
|
Here is my proposal for adding the navigation feature.
The
Chronocomponent now exposes a new optional propertyinitialActiveTimelineItem, which instructs the component which item should activate on load. That comes useful when the timeline shows items where the most recent is the most interesting (es. incoming mail messages).There's another modification: the ability to navigate programmatically to any of the loaded items. That is done by exposing a kind of "API" via ref. That comes useful when the component is already shown, but you need to highlight the item upon something else selection.
It would be nice if the initial scrolling will happen without animation, but I was unable to follow your code to do that.
Let me know if you need clarifications about my code.
Mario