feat(tslint): adopt eslint & fix issues it raised

TSlint is deprecated, no reason to keep using it

Author: synecdokey

.eslintrc.js

@@ -0,0 +1,23 @@
+module.exports = {
+    parser: "@typescript-eslint/parser",
+    parserOptions: {
+        jsx: true,
+    },
+    plugins: ["react", "@typescript-eslint", "jsx-a11y"],
+    extends: [
+        "eslint:recommended",
+        "plugin:react/recommended",
+        "plugin:@typescript-eslint/recommended",
+        "plugin:jsx-a11y/recommended",
+    ],
+    settings: {
+        react: {
+            pragma: "React",
+            version: "detect",
+        },
+    },
+    rules: {
+        "@typescript-eslint/no-non-null-assertion": "off",
+        "react/prop-types": "off",
+    },
+};

package.json

@@ -13,7 +13,7 @@
         "test:coverage": "jest --coverage",
         "test:coverage:watch": "jest --coverage --watch",
         "coveralls": "cat ./coverage/lcov.info | coveralls",
-        "lint": "tslint --project .",
+        "lint": "eslint src",
         "typecheck": "tsc --project .",
         "build": "rimraf \"dist/**/*\" && yarn build:rollup && yarn build:types && yarn build:css",
         "build:css": "cp src/css/*.css dist",
@@ -95,11 +95,16 @@
         "@types/react-dom": "^16.8.4",
         "@types/react-test-renderer": "^16.8.2",
         "@types/uuid": "^3.4.4",
+        "@typescript-eslint/eslint-plugin": "^3.6.0",
+        "@typescript-eslint/parser": "^3.6.0",
         "babel-core": "^7.0.0-bridge.0",
         "babel-jest": "^24.8.0",
         "babel-loader": "^8.0.6",
         "coveralls": "^3.0.3",
         "css-loader": "^3.0.0",
+        "eslint": "^7.4.0",
+        "eslint-plugin-jsx-a11y": "^6.3.1",
+        "eslint-plugin-react": "^7.20.3",
         "file-loader": "^4.0.0",
         "gh-pages": "^2.0.1",
         "html-webpack-plugin": "^3.2.0",
@@ -119,11 +124,6 @@
         "rollup-plugin-node-resolve": "^5.1.0",
         "rollup-plugin-replace": "^2.1.1",
         "style-loader": "^0.23.1",
-        "tslint": "^6.1.2",
-        "tslint-config-prettier": "^1.18.0",
-        "tslint-microsoft-contrib": "^6.2.0",
-        "tslint-plugin-prettier": "^2.3.0",
-        "tslint-react": "^5.0.0",
         "typescript": "^3.9.5",
         "uuid": "^3.3.2",
         "webpack": "^4.29.6",

src/components/AccordionItemButton.tsx

@@ -73,7 +73,8 @@ const AccordionItemButton = ({
         <div
             className={className}
             {...rest}
-            // tslint:disable-next-line react-a11y-event-has-role
+            role="button"
+            tabIndex={0}
             onClick={toggleExpanded}
             onKeyDown={handleKeyPress}
             data-accordion-component="AccordionItemButton"

src/components/ItemContext.tsx

@@ -69,8 +69,9 @@ class Provider extends React.Component<ProviderProps> {
                     headingAttributes,
                     buttonAttributes,
                 }}
-                children={this.props.children}
-            />
+            >
+                {this.props.children}
+            </Context.Provider>
         );
     };
 

src/helpers/uuid.ts

@@ -17,11 +17,11 @@ export function resetNextUuid(): void {
 
 // HTML5 ids allow all unicode characters, except for ASCII whitespaces
 // https://infra.spec.whatwg.org/#ascii-whitespace
+// eslint-disable-next-line no-control-regex
 const idRegex = /[\u0009\u000a\u000c\u000d\u0020]/g;
 
 export function assertValidHtmlId(htmlId: string): boolean {
     if (htmlId === '' || idRegex.test(htmlId)) {
-        // tslint:disable-next-line
         console.error(
             `uuid must be a valid HTML5 id but was given "${htmlId}", ASCII whitespaces are forbidden`,
         );