(add) : Add support for eslint (airbnb style guide).

.eslintrc.json

@@ -0,0 +1,23 @@
+{
+  "env": {
+    "browser": true,
+    "es6": true
+  },
+  "extends": ["plugin:react/recommended", "airbnb", "prettier"],
+  "globals": {
+    "Atomics": "readonly",
+    "SharedArrayBuffer": "readonly"
+  },
+  "parserOptions": {
+    "ecmaFeatures": {
+      "jsx": true
+    },
+    "ecmaVersion": 2018,
+    "sourceType": "module"
+  },
+  "plugins": ["react"],
+  "rules": {
+    "no-restricted-syntax": "off",
+    "no-use-before-define": ["error", { "functions": false }]
+  }
+}

.prettierrc

@@ -1,10 +1,10 @@
 {
   "singleQuote": true,
   "jsxSingleQuote": true,
-  "semi": false,
+  "semi": true,
   "tabWidth": 2,
   "bracketSpacing": true,
   "jsxBracketSameLine": false,
   "arrowParens": "always",
-  "trailingComma": "none"
+  "trailingComma": "es5"
 }

src/index.js

@@ -1,48 +1,50 @@
-import { useState, useEffect, useRef } from 'react'
+import { useState, useEffect, useRef } from 'react';
 
 const useResizeObserver = (option = 'contentRect') => {
-  const ref = useRef(null)
-  const [height, setHeight] = useState()
-  const [width, setWidth] = useState()
+  const ref = useRef(null);
+  const [height, setHeight] = useState();
+  const [width, setWidth] = useState();
 
   useEffect(() => {
     if (ref.current) {
       const observer = new ResizeObserver((entries) => {
-        handleResize(entries)
-      })
-      observer.observe(ref.current)
+        handleResize(entries);
+      });
+      observer.observe(ref.current);
 
       // Callback fired when component is unmounted
       return () => {
-        observer.disconnect()
-      }
+        observer.disconnect();
+      };
     }
-  })
+    // Added this return for eslint rule -> no-consisten-return
+    return undefined;
+  });
 
-  const handleResize = (entries) => {
-    for (let entry of entries) {
+  function handleResize(entries) {
+    for (const entry of entries) {
       if (
         option === 'borderBoxSize' &&
         entry.borderBoxSize &&
         entry.borderBoxSize.length > 0
       ) {
-        setHeight(entry.borderBoxSize[0].blockSize)
-        setWidth(entry.borderBoxSize[0].inlineSize)
+        setHeight(entry.borderBoxSize[0].blockSize);
+        setWidth(entry.borderBoxSize[0].inlineSize);
       } else if (
         option === 'contentBoxSize' &&
         entry.contentBoxSize &&
         entry.contentBoxSize.length > 0
       ) {
-        setHeight(entry.contentBoxSize[0].blockSize)
-        setWidth(entry.contentBoxSize[0].inlineSize)
+        setHeight(entry.contentBoxSize[0].blockSize);
+        setWidth(entry.contentBoxSize[0].inlineSize);
       } else {
-        setHeight(entry.contentRect.height)
-        setWidth(entry.contentRect.width)
+        setHeight(entry.contentRect.height);
+        setWidth(entry.contentRect.width);
       }
     }
   }
 
-  return [ref, width, height]
-}
+  return [ref, width, height];
+};
 
-export default useResizeObserver
+export default useResizeObserver;