- update webpack and switch to typescript

.eslintrc.json

@@ -1,7 +1,8 @@
 {
+  "parser": "@babel/eslint-parser",
   // Extend existing configuration
   // from ESlint and eslint-plugin-react defaults.
-  "extends": ["eslint:recommended", "plugin:react/recommended"],
+  "extends": ["airbnb"],
   // Enable ES6 support. If you want to use custom Babel
   // features, you will need to enable a custom parser
   // as described in a section below.
@@ -13,26 +14,25 @@
     }
   },
   "env": {
-    "jest": true,
     "es6": true,
     "browser": true,
     "node": true,
     "jquery": true
   },
   // Enable custom plugin known as eslint-plugin-react
-  "plugins": ["react", "react-hooks"],
+  "plugins": ["@typescript-eslint"],
   "rules": {
+    "import/no-unresolved": 0,
+    "react/jsx-filename-extension": {
+      "extensions": [".jsx", ".tsx"]
+    },
     // Disable `no-console` rule
     "no-console": 0,
     // Give a warning if identifiers contain underscores
-    "no-underscore-dangle": 1,
-    "no-debugger": 0,
+    "no-underscore-dangle": 0,
+    "no-empty-pattern": 0,
+    "react/prop-types": [0],
     "react-hooks/rules-of-hooks": "error",
-    "no-empty": [
-      "error",
-      {
-        "allowEmptyCatch": true
-      }
-    ]
+    "react/display-name": [0, { "ignoreTranspilerName": true }]
   }
 }

example/index.js

@@ -1,7 +1,6 @@
-import 'core-js/es6/map';
-import 'core-js/es6/set';
 import 'raf/polyfill';
-import 'babel-polyfill';
+import "core-js/stable";
+import "regenerator-runtime/runtime";
 import React, { useState, useRef, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import ReactDOM from 'react-dom';
@@ -10,7 +9,7 @@ import prefixAll from 'inline-style-prefix-all';
 import Prism from 'prismjs';
 import 'prismjs/themes/prism-tomorrow.css';
 import CSS from '../src/css/example.css';
-import ReactCodesInput from '../src/js/Input/index.js';
+import ReactCodesInput from '../src/js/Input/index.tsx';
 
 const markdownTextboxEmptyExample = `
 \`\`\`javascript

jest.config.js

@@ -1,27 +1,29 @@
 module.exports = {
-    collectCoverageFrom: ['src/**/*.{js,jsx}'],
-    transform: {
-        '^.+\\.(js|jsx)$': 'babel-jest',
-    },
-    verbose: true,
-    moduleNameMapper: {
-        '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': '<rootDir>/assetsTransformer.js',
-        '\\.(css|less)$': 'identity-obj-proxy',
-        '^STYLES(.*)$': '<rootDir>/src/css$1',
-        '^COMPONENTS(.*)$': '<rootDir>/src/js/app/components$1',
-        '^API(.*)$': '<rootDir>/src/js/api$1',
-        '^CONFIG(.*)$': '<rootDir>/src/config$1',
-        '^IMAGES(.*)$': '<rootDir>/src/image$1',
-        '^AUDIOS(.*)$': '<rootDir>/audio/api$1',
-        '^VIDEOS(.*)$': '<rootDir>/src/video$1',
-        '^LOCALES(.*)$': '<rootDir>/src/locales$1',
-        '^COMMON(.*)$': '<rootDir>/src/js/common$1',
-        '^APP(.*)$': '<rootDir>/src/js/app$1',
-        '^CONSTS(.*)$': '<rootDir>/src/js/consts$1',
-        '^PAGES(.*)$': '<rootDir>/src/js/api$1',
-        '^ACTIONS(.*)$': '<rootDir>/src/js/actions$1',
-        '^STORE(.*)$': '<rootDir>/src/js/store$1',
-        '^REDUCERS(.*)$': '<rootDir>/src/js/reducers$1',
-        '^VENDOR(.*)$': '<rootDir>/src/js/vendor$1',
-    },
+    testEnvironment: 'jsdom',
+  preset: 'ts-jest',
+  transform: {
+    '^.+\\.(js|jsx)$': 'babel-jest',
+    '^.+\\.tsx?$': 'ts-jest',
+  },
+  verbose: true,
+  moduleNameMapper: {
+    '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': '<rootDir>/assetsTransformer.js',
+    '\\.(css|scss)$': 'identity-obj-proxy',
+    '^STYLES(.*)$': '<rootDir>/src/css$1',
+    '^COMPONENTS(.*)$': '<rootDir>/src/js/app/components$1',
+    '^API(.*)$': '<rootDir>/src/js/api$1',
+    '^CONFIG(.*)$': '<rootDir>/src/config$1',
+    '^IMAGES(.*)$': '<rootDir>/src/image$1',
+    '^AUDIOS(.*)$': '<rootDir>/audio/api$1',
+    '^VIDEOS(.*)$': '<rootDir>/src/video$1',
+    '^LOCALES(.*)$': '<rootDir>/src/locales$1',
+    '^COMMON(.*)$': '<rootDir>/src/js/common$1',
+    '^APP(.*)$': '<rootDir>/src/js/app$1',
+    '^CONSTS(.*)$': '<rootDir>/src/js/consts$1',
+    '^PAGES(.*)$': '<rootDir>/src/js/api$1',
+    '^ACTIONS(.*)$': '<rootDir>/src/js/actions$1',
+    '^STORE(.*)$': '<rootDir>/src/js/store$1',
+    '^REDUCERS(.*)$': '<rootDir>/src/js/reducers$1',
+    '^VENDOR(.*)$': '<rootDir>/src/js/vendor$1',
+  },
 };