Support MUI v5; removal of "@mui/styles" dependency; TypeScript rewrite;

.eslintrc.json

@@ -5,91 +5,82 @@
     "mocha": true,
     "node": true
   },
-  "parser": "babel-eslint",
+  "parser": "@typescript-eslint/parser",
   "parserOptions": {
     "ecmaVersion": 7,
     "sourceType": "module",
     "ecmaFeatures": {
-      "jsx": true,
-      "experimentalObjectRestSpread": true
+      "experimentalObjectRestSpread": true,
+      "jsx": true
     }
   },
   "globals": {
-    "React": true
+    "React": true,
+    "JSX": true
   },
   "settings": {
+    "import/resolver": {
+      "node": {
+        "extensions": [".js", ".jsx", ".d.ts", ".ts", ".tsx"]
+      }
+    },
     "react": {
-      "version": "15.0"
+      "version": "detect"
     }
   },
   "plugins": [
     "babel",
-    "react"
+    "@typescript-eslint",
+    "react-hooks",
+    "react",
+    "simple-import-sort",
+    "import"
   ],
   "extends": [
     "eslint:recommended",
-    "plugin:react/recommended"
+    "plugin:react/recommended",
+    "plugin:import/errors",
+    "plugin:import/typescript",
+    "prettier"
   ],
   "rules": {
-    "array-bracket-spacing": ["error", "never"],
-    "arrow-parens": "error",
-    "arrow-spacing": "error",
-    "brace-style": "error",
-    "comma-dangle": ["error", "always-multiline"],
-    "comma-spacing": ["error", {"before": false, "after": true}],
-    "comma-style": ["error", "last"],
-    "computed-property-spacing": ["error", "never"],
-    "consistent-return": "off",
-    "consistent-this": ["error", "self"],
-    "dot-location": ["error", "property"],
-    "dot-notation": "error",
-    "eol-last": "error",
-    "eqeqeq": ["error", "smart"],
-    "generator-star-spacing": "error",
-    "id-blacklist": ["error", "e"],
-    "indent": ["error", 4, {"SwitchCase": 1}],
-    "jsx-quotes": ["error", "prefer-double"],
-    "key-spacing": "error",
-    "keyword-spacing": "error",
-    "max-len": ["error", 120, 4, {"ignoreComments": true}],
-    "new-cap": ["off", {"capIsNew": true, "newIsCap": true}],
-    "no-await-in-loop": "error",
-    "no-case-declarations": "off",
-    "no-cond-assign": "error",
-    "no-dupe-args": "error",
-    "no-dupe-keys": "error",
-    "no-duplicate-case": "error",
-    "no-empty-pattern": "error",
-    "no-extra-boolean-cast": "error",
-    "no-extra-semi": "error",
-    "no-multi-spaces": "error",
-    "no-multiple-empty-lines": "error",
-    "no-shadow": "off",
-    "no-spaced-func": "error",
-    "no-trailing-spaces": "error",
-    "no-undef": "error",
-    "no-underscore-dangle": "error",
-    "no-unneeded-ternary": "error",
+    "@typescript-eslint/no-shadow": ["error", { "hoist": "never" }],
+    "@typescript-eslint/no-unused-vars": [
+      "error",
+      {
+        "args": "after-used",
+        "argsIgnorePattern": "^_",
+        "ignoreRestSiblings": true,
+        "varsIgnorePattern": "^_"
+      }
+    ],
+    "arrow-body-style": 0,
+    "camelcase": 0,
+    "class-methods-use-this": 0,
+    "import/no-deprecated": "warn",
+    "import/no-duplicates": "error",
+    "import/no-extraneous-dependencies": 0,
+    "import/order": "off",
+    "no-confusing-arrow": 0,
+    "no-console": "warn",
+    "no-else-return": 0,
+    "no-nested-ternary": 0,
+    "no-param-reassign": ["error", { "props": false }],
+    "no-restricted-syntax": 0,
+    "no-return-assign": [2, "except-parens"],
+    "no-underscore-dangle": 0,
     "no-unreachable": "error",
-    "no-unused-expressions": "error",
-    "no-unused-vars": "error",
-    "no-var": "error",
-    "object-curly-spacing": ["error", "never"],
-    "one-var": ["error", "never"],
-    "operator-linebreak": ["error", "after"],
-    "padded-blocks": ["error", "never"],
-    "prefer-arrow-callback": "off",
-    "prefer-const": "error",
-    "quotes": ["error", "single", "avoid-escape"],
-    "semi": ["error", "always"],
-    "space-before-blocks": ["error", "always"],
-    "space-before-function-paren": ["error", "never"],
-    "space-infix-ops": "error",
-    "space-unary-ops": ["error", {"words": true, "nonwords": false}],
-    "spaced-comment": "error",
-    "strict": "off",
-    "yoda": "error",
-    "babel/new-cap": "off",
-    "babel/object-shorthand": "off"
+    "no-unused-expressions": ["error", { "allowTernary": true }],
+    "prefer-arrow-callback": ["error", { "allowNamedFunctions": true }],
+    "react-hooks/exhaustive-deps": "error",
+    "react-hooks/rules-of-hooks": "error",
+    "react/destructuring-assignment": 0,
+    "react/jsx-filename-extension": 0,
+    "react/no-multi-comp": 0,
+    "react/no-unescaped-entities": 0,
+    "react/prop-types": 0,
+    "simple-import-sort/exports": "error",
+    "simple-import-sort/imports": "error",
+    "sort-imports": "off"
   }
 }

.github/ISSUE_TEMPLATE/bug_report.md

@@ -42,7 +42,7 @@ If applicable, add screenshots to help explain your problem.
 
 - OS: [e.g. iOS]
 - Browser: [e.g. chrome, safari]
-- `@material-ui/core` version: [e.g. 4.9.2]
+- `@mui/material` version: [e.g. 5.0.2]
 - `material-ui-dropzone` version: [e.g. 3.0.1]
 
 ### Additional context

.gitignore

@@ -3,3 +3,5 @@
 build/
 node_modules/
 styleguide/
+tsconfig.tsbuildinfo
+/dist

.prettierrc

@@ -0,0 +1,3 @@
+{
+    "jsxSingleQuote": false
+}

.size-snapshot.json

@@ -1,20 +1,20 @@
 {
   "dist/index.js": {
-    "bundled": 57189,
-    "minified": 25753,
-    "gzipped": 5983
+    "bundled": 57136,
+    "minified": 25700,
+    "gzipped": 5981
   },
   "dist/index.es.js": {
-    "bundled": 56007,
-    "minified": 24741,
-    "gzipped": 5861,
+    "bundled": 55954,
+    "minified": 24688,
+    "gzipped": 5858,
     "treeshaked": {
       "rollup": {
-        "code": 10815,
-        "import_statements": 1533
+        "code": 10762,
+        "import_statements": 1480
       },
       "webpack": {
-        "code": 21871
+        "code": 21818
       }
     }
   }

.vscode/extensions.json

@@ -0,0 +1,6 @@
+{
+  "recommendations": [
+    "dbaeumer.vscode-eslint", // ESLint
+    "esbenp.prettier-vscode" // Prettier
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,22 @@
+{
+  "editor.tabSize": 2,
+  "editor.insertSpaces": true,
+  "editor.formatOnSave": true,
+  "eslint.enable": true,
+  "eslint.lintTask.enable": true,
+  "eslint.lintTask.options": "--ext .js,.jsx,.ts,.tsx .",
+  "eslint.validate": [
+    "javascript",
+    "javascriptreact",
+    "typescript",
+    "typescriptreact"
+  ],
+  "editor.codeActionsOnSave": {
+    "source.fixAll": true
+  },
+  "files.insertFinalNewline": true,
+  "files.trimTrailingWhitespace": true,
+  "[typescriptreact]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  }
+}