Merge pull request #6 from lmichelin/typescript

Migrate to TypeScript

Author: Aminadav

index.js

@@ -0,0 +1,28 @@
+import { useCallback, useRef, useState, SetStateAction, Dispatch } from "react";
+
+const isFunction = <S>(setStateAction: SetStateAction<S>): setStateAction is (prevState: S) => S =>
+  typeof setStateAction === "function";
+
+type ReadOnlyRefObject<T> = {
+  readonly current: T;
+};
+
+type UseStateRef = {
+  <S>(initialState: S | (() => S)): [S, Dispatch<SetStateAction<S>>, ReadOnlyRefObject<S>];
+  <S = undefined>(): [S | undefined, Dispatch<SetStateAction<S | undefined>>, ReadOnlyRefObject<S | undefined>];
+};
+
+const useStateRef: UseStateRef = <S>(initialState?: S | (() => S)) => {
+  const [state, setState] = useState(initialState);
+  const ref = useRef(state);
+
+  const dispatch: typeof setState = useCallback(setStateAction => {
+    ref.current = isFunction(setStateAction) ? setStateAction(ref.current) : setStateAction;
+
+    setState(ref.current);
+  }, []);
+
+  return [state, dispatch, ref];
+};
+
+export = useStateRef;

index.ts

@@ -2,9 +2,13 @@
   "name": "react-usestateref",
   "version": "1.0.4",
   "description": "useRef and UseState together!",
-  "main": "index.js",
+  "main": "dist/index.js",
+  "files": [
+    "dist"
+  ],
   "scripts": {
-    "deploy": "npm version patch && git add . && git commit && git push && npm publish"
+    "build": "rimraf dist && tsc",
+    "deploy": "npm run build && npm version patch && git push && npm publish"
   },
   "peerDependencies": {
     "react": ">16.0.0"
@@ -24,5 +28,10 @@
   "bugs": {
     "url": "https://github.com/Aminadav/react-useRefState/issues"
   },
-  "homepage": "https://github.com/Aminadav/react-useRefState#readme"
+  "homepage": "https://github.com/Aminadav/react-useRefState#readme",
+  "devDependencies": {
+    "@types/react": "^17.0.16",
+    "rimraf": "^3.0.2",
+    "typescript": "^4.3.5"
+  }
 }

package.json

@@ -0,0 +1,8 @@
+{
+  "compilerOptions": {
+    "strict": true,
+    "lib": ["ES2015"],
+    "outDir": "dist",
+    "declaration": true
+  }
+}