chore: example init

Author: ron0115

example/index.tsx

@@ -1,9 +1,36 @@
-import 'react-app-polyfill/ie11';
-import * as React from 'react';
-import * as ReactDOM from 'react-dom';
+import "react-app-polyfill/ie11";
+import * as ReactDOM from "react-dom";
+import React, { useRef } from "react";
+import { useSmoothScroll } from "react-smooth-scroll-hook";
+export default function App() {
+  const ref = useRef(null);
+  const { scrollTo } = useSmoothScroll({
+    ref
+  });
+  return (
+    <div className="App">
+      <h1>react-smooth-scroll-hook</h1>
+      <button onClick={() => scrollTo("#item-10")}>scrollTo("#item-10")</button>
+      <button onClick={() => scrollTo(Infinity)}>scrollTo(Infinity)</button>
+      <button onClick={() => scrollTo(-Infinity)}>scrollTo(-Infinity)</button>
+      <br />
+      <div
+        ref={ref}
+        style={{
+          overflowY: "scroll",
+          maxHeight: "400px"
+        }}
+      >
+        {Array(100)
+          .fill(null)
+          .map((_item, i) => (
+            <div key={i} id={`item-${i}`}>
+              {i}
+            </div>
+          ))}
+      </div>
+    </div>
+  );
+}
 
-const App = () => {
-  return <div></div>;
-};
-
-ReactDOM.render(<App />, document.getElementById('root'));
+ReactDOM.render(<App />, document.getElementById("root"));

example/package.json

@@ -8,17 +8,16 @@
     "build": "parcel build index.html"
   },
   "dependencies": {
-    "react-app-polyfill": "^1.0.0"
-  },
-  "alias": {
-    "react": "../node_modules/react",
-    "react-dom": "../node_modules/react-dom/profiling",
-    "scheduler/tracing": "../node_modules/scheduler/tracing-profiling"
+    "@types/node": "14.6.0",
+    "react": "16.13.1",
+    "react-app-polyfill": "^1.0.0",
+    "react-dom": "16.13.1",
+    "react-smooth-scroll-hook": "1.2.0"
   },
   "devDependencies": {
     "@types/react": "^16.9.11",
     "@types/react-dom": "^16.8.4",
     "parcel": "^1.12.3",
     "typescript": "^3.4.5"
   }
-}
+}

example/tsconfig.json

@@ -1,6 +1,5 @@
 {
   "compilerOptions": {
-    "allowSyntheticDefaultImports": false,
     "target": "es5",
     "module": "commonjs",
     "jsx": "react",
@@ -12,8 +11,13 @@
     "strictNullChecks": true,
     "preserveConstEnums": true,
     "sourceMap": true,
-    "lib": ["es2015", "es2016", "dom"],
+    "lib": [
+      "es2015",
+      "es2016",
+      "dom"
+    ],
     "baseUrl": ".",
-    "types": ["node"]
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true
   }
-}
+}