Security News
GitHub Removes Malicious Pull Requests Targeting Open Source Repositories
GitHub removed 27 malicious pull requests attempting to inject harmful code across multiple open source repositories, in another round of low-effort attacks.
react-scrollable-anchor
Advanced tools
Lightweight library for smooth scrolling anchors in React, tied to URL hash.
<a href='#sectionId'>
.npm install --save react-scrollable-anchor
To run examples locally, npm run example
, then open your
browser to localhost:3210.
Use the ScrollableAnchor
tag to wrap any React element, making it a scrollable anchor.
import React, { Component } from 'react'
import ScrollableAnchor from 'react-scrollable-anchor'
export default class Page extends Component {
render() {
return (
<div>
<a href='#section1'> Go to section 1 </a>
<a href='#section2'> Go to section 2 </a>
<ScrollableAnchor id={'section1'}>
<div> Hello World </div>
</ScrollableAnchor>
<ScrollableAnchor id={'section2'}>
<div> How are you world? </div>
</ScrollableAnchor>
</div>
)
}
}
Access configureAnchors to customize scrolling and anchors.
import { configureAnchors } from 'react-scrollable-anchor'
// Offset all anchors by -60 to account for a fixed header
// and scroll more quickly than the default 400ms
configureAnchors({offset: -60, scrollDuration: 200})
option | default |
---|---|
offset | 0 |
scrollDuration | 400 |
keepLastAnchorHash | false |
A small toolkit of scrolling utilies for use with anchors
import { goToTop } from 'react-scrollable-anchor'
// scroll to top of the page
goToTop()
import { goToAnchor } from 'react-scrollable-anchor'
// scroll to #section1 without saving that hash update in history
goToAnchor('section1')
goToAnchor('section1', false)
// scroll to #section1, saving that hash update in history
goToAnchor('section1', true)
import { removeHash } from 'react-scrollable-anchor'
// clear URL hash
removeHash()
Please open issues on Github. Issues are easier to address if you include context and code samples.
Please contribute!
Feel free to contact me at gabergg@gmail.com.
FAQs
Provide smooth scrolling anchors in React.
We found that react-scrollable-anchor demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
GitHub removed 27 malicious pull requests attempting to inject harmful code across multiple open source repositories, in another round of low-effort attacks.
Security News
RubyGems.org has added a new "maintainer" role that allows for publishing new versions of gems. This new permission type is aimed at improving security for gem owners and the service overall.
Security News
Node.js will be enforcing stricter semver-major PR policies a month before major releases to enhance stability and ensure reliable release candidates.