Feature/3.0.0

.eslintignore

@@ -0,0 +1,3 @@
+src/tests
+config
+definitions

.eslintrc.js

@@ -1,3 +1,13 @@
 module.exports = {
-    "extends": ["airbnb", "prettier"]
-};
+  root: true,
+  parser: "@typescript-eslint/parser",
+  plugins: ["@typescript-eslint", "jsx-a11y"],
+  extends: [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "prettier",
+    "prettier/@typescript-eslint",
+    "plugin:react-hooks/recommended",
+    "plugin:react/recommended",
+  ],
+};

.github/CODE_OF_CONDUCT.md

@@ -8,19 +8,19 @@ In the interest of fostering an open and welcoming environment, we as contributo
 
 Examples of behavior that contributes to creating a positive environment include:
 
-* Using welcoming and inclusive language
-* Being respectful of differing viewpoints and experiences
-* Gracefully accepting constructive criticism
-* Focusing on what is best for the community
-* Showing empathy towards other community members
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
 
 Examples of unacceptable behavior by participants include:
 
-* The use of sexualized language or imagery and unwelcome sexual attention or advances
-* Trolling, insulting/derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or electronic address, without explicit permission
-* Other conduct which could reasonably be considered inappropriate in a professional setting
+- The use of sexualized language or imagery and unwelcome sexual attention or advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or electronic address, without explicit permission
+- Other conduct which could reasonably be considered inappropriate in a professional setting
 
 ## Our Responsibilities
 

.github/stale.yml

@@ -0,0 +1,17 @@
+# Number of days of inactivity before an issue becomes stale
+daysUntilStale: 60
+# Number of days of inactivity before a stale issue is closed
+daysUntilClose: 7
+# Issues with these labels will never be considered stale
+exemptLabels:
+  - pinned
+  - important
+# Label to use when marking an issue as stale
+staleLabel: stale
+# Comment to post when marking an issue as stale. Set to `false` to disable
+markComment: >
+  This issue has been automatically marked as stale because it has not had
+  recent activity. It will be closed if no further activity occurs. Thank you
+  for your contributions. 😃
+# Comment to post when closing a stale issue. Set to `false` to disable
+closeComment: true

.github/workflows/nodejs.yml

@@ -11,14 +11,14 @@ jobs:
         node-version: [10.x, 12.x]
 
     steps:
-    - uses: actions/checkout@v2
+      - uses: actions/checkout@v2
 
-    - uses: pnpm/[email protected]
-      with:
-        version: 5.1.2
-        run_install: |
-          args: [--frozen-lockfile]
-    - run: pnpm run build
-    - run: pnpm run test
-      env:
-        CI: true
+      - uses: pnpm/[email protected]
+        with:
+          version: 5.1.2
+          run_install: |
+            args: [--frozen-lockfile]
+      - run: pnpm run build
+      - run: pnpm run test
+        env:
+          CI: true

.storybook/main.js

@@ -0,0 +1,10 @@
+module.exports = {
+  "stories": [
+    "../src/**/*.stories.mdx",
+    "../src/**/*.stories.@(js|jsx|ts|tsx)"
+  ],
+  "addons": [
+    "@storybook/addon-links",
+    "@storybook/addon-essentials"
+  ]
+}

.storybook/manager.js

@@ -0,0 +1,6 @@
+import { addons } from "@storybook/addons";
+import { themes } from "@storybook/theming";
+
+addons.setConfig({
+  theme: themes.dark,
+});

.storybook/preview-head.html

@@ -0,0 +1,60 @@
+<script>
+  window.__DEV__ = true;
+</script>
+
+<link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
+
+<style>
+  html,
+  body {
+    font: 15px/22px "Inter var", system-ui, sans-serif;
+    font-variant-ligatures: contextual common-ligatures;
+    font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
+    font-kerning: normal;
+
+    line-height: 1.5rem;
+    letter-spacing: -0.04rem;
+  }
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5 {
+    font-weight: 800;
+    line-height: 0.72;
+    margin: 0;
+  }
+
+  h1 {
+    font-size: 3rem;
+  }
+  h2 {
+    font-size: 2.5rem;
+  }
+  p {
+    font-size: 1.2rem;
+    opacity: 0.9;
+  }
+
+  button {
+    padding: 0.8rem 1.5rem;
+    font-weight: 600;
+    font-size: 1rem;
+    letter-spacing: -0.02rem;
+    color: #111;
+    background: #fff;
+    border-radius: 0.2rem;
+    border: 0;
+    cursor: pointer;
+    outline: 0;
+    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3),
+      0 2px 4px -1px rgba(0, 0, 0, 0.1);
+
+    transition: all 0.1s ease-in-out;
+  }
+  button:hover {
+    transform: translateY(-1px);
+    background: #ddd;
+  }
+</style>

.storybook/preview.js

@@ -0,0 +1,10 @@
+import { themes } from "@storybook/theming";
+
+// or global addParameters
+export const parameters = {
+  docs: {
+    theme: themes.dark,
+  },
+  layout: "padded",
+  actions: { argTypesRegex: "^on[A-Z].*" },
+};

CONTRIBUTING.md

@@ -1,19 +1,19 @@
 # Contributing
 
 When contributing to this repository, please first discuss the change you wish to make via issue,
-email, or any other method with the owners of this repository before making a change. 
+email, or any other method with the owners of this repository before making a change.
 
 Please note we have a code of conduct, please follow it in all your interactions with the project.
 
 ## Pull Request Process
 
-1. Ensure any install or build dependencies are removed before the end of the layer when doing a 
+1. Ensure any install or build dependencies are removed before the end of the layer when doing a
    build.
-2. Update the README.md with details of changes to the interface, this includes new environment 
+2. Update the README.md with details of changes to the interface, this includes new environment
    variables, exposed ports, useful file locations and container parameters.
 3. Increase the version numbers in any examples files and the README.md to the new version that this
    Pull Request would represent. The versioning scheme we use is [SemVer](http://semver.org/).
-4. You may merge the Pull Request in once you have the sign-off of two other developers, or if you 
+4. You may merge the Pull Request in once you have the sign-off of two other developers, or if you
    do not have permission to do that, you may request the second reviewer to merge it for you.
 
 ## Code of Conduct
@@ -32,21 +32,21 @@ orientation.
 Examples of behavior that contributes to creating a positive environment
 include:
 
-* Using welcoming and inclusive language
-* Being respectful of differing viewpoints and experiences
-* Gracefully accepting constructive criticism
-* Focusing on what is best for the community
-* Showing empathy towards other community members
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
 
 Examples of unacceptable behavior by participants include:
 
-* The use of sexualized language or imagery and unwelcome sexual attention or
-advances
-* Trolling, insulting/derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or electronic
+- The use of sexualized language or imagery and unwelcome sexual attention or
+  advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or electronic
   address, without explicit permission
-* Other conduct which could reasonably be considered inappropriate in a
+- Other conduct which could reasonably be considered inappropriate in a
   professional setting
 
 ### Our Responsibilities

README.md

@@ -128,7 +128,7 @@ export default class MyComponent extends Component {
 import React from "react";
 import { ScrollToHOC } from "react-scroll-to";
 
-export default ScrollToHOC(function(props) {
+export default ScrollToHOC(function (props) {
   return <a onClick={() => props.scroll({ y: 500 })}>Scroll to Bottom</a>;
 });
 ```
@@ -138,7 +138,7 @@ export default ScrollToHOC(function(props) {
 import React from "react";
 import { ScrollToHOC, ScrollArea } from "react-scroll-to";
 
-export default ScrollToHOC(function(props) {
+export default ScrollToHOC(function (props) {
   return (
     <ScrollArea style={{ height: 1000 }}>
       <a onClick={() => props.scroll({ y: 500 })}>Scroll to Bottom</a>
@@ -152,7 +152,7 @@ export default ScrollToHOC(function(props) {
 import React from "react";
 import { ScrollToHOC, ScrollArea } from "react-scroll-to";
 
-export default ScrollToHOC(function(props) {
+export default ScrollToHOC(function (props) {
   return (
     <div>
       <ScrollArea id="foo" style={{ height: 1000 }}>
@@ -197,27 +197,3 @@ Mixing and matching these options give different results.
 Some browsers don't natively support smooth scroll. Checkout adding a polyfill like `smoothscroll-polyfill` to fix the issue.
 
 `npm install smoothscroll-polyfill`
-
-## Contributors
-
-Thanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):
-
-<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
-<!-- prettier-ignore-start -->
-<!-- markdownlint-disable -->
-<table>
-  <tr>
-    <td align="center"><a href="http://www.dylanpaulus.com"><img src="https://avatars3.githubusercontent.com/u/5566054?v=4" width="100px;" alt="Dylan Paulus"/><br /><sub><b>Dylan Paulus</b></sub></a><br /><a href="https://github.com/ganderzz/react-scroll-to/commits?author=ganderzz" title="Code">💻</a> <a href="https://github.com/ganderzz/react-scroll-to/commits?author=ganderzz" title="Documentation">📖</a></td>
-    <td align="center"><a href="http://anthonyng.me"><img src="https://avatars1.githubusercontent.com/u/14035529?v=4" width="100px;" alt="Anthony Ng"/><br /><sub><b>Anthony Ng</b></sub></a><br /><a href="https://github.com/ganderzz/react-scroll-to/commits?author=newyork-anthonyng" title="Code">💻</a> <a href="https://github.com/ganderzz/react-scroll-to/commits?author=newyork-anthonyng" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/UmenR"><img src="https://avatars1.githubusercontent.com/u/17663679?v=4" width="100px;" alt="UmenR"/><br /><sub><b>UmenR</b></sub></a><br /><a href="https://github.com/ganderzz/react-scroll-to/commits?author=UmenR" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/ywen"><img src="https://avatars2.githubusercontent.com/u/22895?v=4" width="100px;" alt="Yi Wen"/><br /><sub><b>Yi Wen</b></sub></a><br /><a href="https://github.com/ganderzz/react-scroll-to/commits?author=ywen" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/thisis-Shitanshu"><img src="https://avatars3.githubusercontent.com/u/45510390?v=4" width="100px;" alt="Shitanshu Pandey"/><br /><sub><b>Shitanshu Pandey</b></sub></a><br /><a href="https://github.com/ganderzz/react-scroll-to/commits?author=thisis-Shitanshu" title="Code">💻</a></td>
-  </tr>
-</table>
-
-<!-- markdownlint-enable -->
-<!-- prettier-ignore-end -->
-
-<!-- ALL-CONTRIBUTORS-LIST:END -->
-
-This project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) specification. Contributions of any kind welcome!