diff --git a/README.rst b/README.rst
index a9a918887..cb354078a 100644
--- a/README.rst
+++ b/README.rst
@@ -157,6 +157,26 @@ You may create a `.env.private` with any overrides of the environment settings c
 
 **Note: .env.private should be added to your project's .gitignore so it does not get checked in.**
 
+Local module configuration for TypeScript
+-----------------------------------------
+
+#. Create file in repository `tsconfig.json`, with a clause `"extends": "@edx/frontend-build"`
+#. Set "rootDir" to the root of the source code folders
+#. Set "include" to wildcard patterns specifying the subdirectories/files under rootDir where source code can be found
+#. Include any wildcards under rootDir that should be excluded using "exclude"
+
+```Sample json
+{
+  "extends": "@edx/frontend-build",
+  "compilerOptions": {
+    "rootDir": ".",
+    "outDir": "dist"
+  },
+  "include": ["src/**/*"],
+  "exclude": ["dist", "node_modules"]
+}
+```
+
 Development
 -----------
 
diff --git a/config/.eslintrc.js b/config/.eslintrc.js
index 78149d727..0646ebca4 100644
--- a/config/.eslintrc.js
+++ b/config/.eslintrc.js
@@ -2,7 +2,8 @@ const { babel } = require('../lib/presets');
 
 module.exports = {
   extends: '@edx/eslint-config',
-  parser: '@babel/eslint-parser',
+  plugins: ['@typescript-eslint'],
+  parser: '@typescript-eslint/parser',
   parserOptions: {
     requireConfigFile: true,
     babelOptions: {
diff --git a/config/jest.config.js b/config/jest.config.js
index ae08b706f..716c0e10c 100644
--- a/config/jest.config.js
+++ b/config/jest.config.js
@@ -1,5 +1,6 @@
 const path = require('path');
 const fs = require('fs');
+const { jsWithTs: tsjPreset } = require('ts-jest/presets');
 
 const presets = require('../lib/presets');
 
@@ -33,11 +34,12 @@ module.exports = {
     '/node_modules/(?!@edx)',
   ],
   transform: {
-    '^.+\\.[t|j]sx?$': [
+    '^.+\\.jsx?$': [
       'babel-jest',
       {
         configFile: presets.babel.resolvedFilepath,
       },
     ],
+    ...tsjPreset.transform,
   },
 };
diff --git a/config/webpack.common.config.js b/config/webpack.common.config.js
index 62c3aa348..8490a665c 100644
--- a/config/webpack.common.config.js
+++ b/config/webpack.common.config.js
@@ -17,6 +17,6 @@ module.exports = {
       // the application being built.
       'env.config': false,
     },
-    extensions: ['.js', '.jsx'],
+    extensions: ['.js', '.jsx', '.ts', '.tsx'],
   },
 };
diff --git a/config/webpack.prod.config.js b/config/webpack.prod.config.js
index 8634a4f9a..2db9ba5b1 100644
--- a/config/webpack.prod.config.js
+++ b/config/webpack.prod.config.js
@@ -71,12 +71,12 @@ module.exports = merge(commonConfig, {
       // The babel-loader transforms newer ES2015+ syntax to older ES5 for older browsers.
       // Babel is configured with the .babelrc file at the root of the project.
       {
-        test: /\.(js|jsx)$/,
+        test: /\.(js|jsx|ts|tsx)$/,
         exclude: /node_modules\/(?!@edx)/,
         use: {
           loader: 'babel-loader',
           options: {
-            configFile: presets.babel.resolvedFilepath,
+            configFile: presets['babel-typescript'].resolvedFilepath,
           },
         },
       },
diff --git a/example/src/App.jsx b/example/src/App.jsx
index 2f1346339..8ef1e4417 100644
--- a/example/src/App.jsx
+++ b/example/src/App.jsx
@@ -1,4 +1,5 @@
 import config from 'env.config';
+import Image from './Image';
 import appleUrl, { ReactComponent as Apple } from './apple.svg';
 import appleImg from './apple.jpg';
 
@@ -19,6 +20,8 @@ export default function App() {
       </ul>
       <h2>JSX parsing tests</h2>
       <Apple style={{ width: '10rem' }} />
+      <h2>TSX parsing tests</h2>
+      <Image src={appleUrl} alt="appleFromTsx" style={{ width: '10rem' }} />
       <h2>Asset import tests</h2>
       <img src={appleUrl} alt="apple" style={{ width: '10rem' }} />
       <img src={appleUrl} alt="apple" style={{ width: '10rem' }} />
diff --git a/example/src/Image.tsx b/example/src/Image.tsx
new file mode 100644
index 000000000..44ece2e0f
--- /dev/null
+++ b/example/src/Image.tsx
@@ -0,0 +1,16 @@
+import React, { CSSProperties } from 'react';
+
+type ImageProps = {
+  src: string;
+  alt?: string;
+  style?: CSSProperties;
+};
+
+const Image = ({ alt, ...rest }:ImageProps) => <img alt={alt} {...rest} />;
+
+const defaultProps = {
+  alt: undefined,
+  style: undefined,
+};
+Image.defaultProps = defaultProps;
+export default Image;
diff --git a/example/src/__snapshots__/App.test.jsx.snap b/example/src/__snapshots__/App.test.jsx.snap
index 5666dd15d..551869852 100644
--- a/example/src/__snapshots__/App.test.jsx.snap
+++ b/example/src/__snapshots__/App.test.jsx.snap
@@ -39,6 +39,18 @@ exports[`Basic test should render 1`] = `
       }
     }
   />
+  <h2>
+    TSX parsing tests
+  </h2>
+  <img
+    alt="appleFromTsx"
+    src="icon/mock/path"
+    style={
+      Object {
+        "width": "10rem",
+      }
+    }
+  />
   <h2>
     Asset import tests
   </h2>
diff --git a/example/tsconfig.json b/example/tsconfig.json
new file mode 100644
index 000000000..2b437fa6d
--- /dev/null
+++ b/example/tsconfig.json
@@ -0,0 +1,16 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "rootDir": ".",
+    "outDir": "dist"
+  },
+  "include": [
+    ".eslintrc.js",
+    "env.config.js",
+    "src"
+  ],
+  "exclude": [
+    "node_modules",
+    "dist",
+  ]
+}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 0af23ba2f..64d0047ff 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,17 +11,20 @@
       "dependencies": {
         "@babel/cli": "7.21.0",
         "@babel/core": "7.21.4",
-        "@babel/eslint-parser": "7.21.3",
         "@babel/plugin-proposal-class-properties": "7.18.6",
         "@babel/plugin-proposal-object-rest-spread": "7.20.7",
         "@babel/plugin-syntax-dynamic-import": "7.8.3",
         "@babel/preset-env": "7.21.4",
         "@babel/preset-react": "7.18.6",
-        "@edx/eslint-config": "3.2.0",
+        "@edx/eslint-config": "4.0.0-alpha.1",
         "@edx/new-relic-source-map-webpack-plugin": "1.0.2",
+        "@edx/typescript-config": "^1.0.0",
         "@fullhuman/postcss-purgecss": "^5.0.0",
         "@pmmmwh/react-refresh-webpack-plugin": "0.5.10",
         "@svgr/webpack": "6.5.1",
+        "@types/jest": "^26.0.0",
+        "@typescript-eslint/eslint-plugin": "^5.58.0",
+        "@typescript-eslint/parser": "^5.58.0",
         "autoprefixer": "10.4.14",
         "babel-jest": "26.6.3",
         "babel-loader": "9.1.2",
@@ -35,6 +38,7 @@
         "dotenv-webpack": "7.1.1",
         "eslint": "8.38.0",
         "eslint-config-airbnb": "19.0.4",
+        "eslint-config-airbnb-typescript": "^17.0.0",
         "eslint-plugin-import": "2.27.5",
         "eslint-plugin-jsx-a11y": "6.7.1",
         "eslint-plugin-react": "7.32.2",
@@ -57,6 +61,8 @@
         "sharp": "^0.32.0",
         "source-map-loader": "^4.0.1",
         "style-loader": "3.3.2",
+        "ts-jest": "^26.5.0",
+        "typescript": "^4.9.4",
         "url-loader": "4.1.1",
         "webpack": "5.79.0",
         "webpack-bundle-analyzer": "4.8.0",
@@ -70,8 +76,7 @@
       "devDependencies": {
         "@babel/preset-typescript": "^7.18.6",
         "@types/react": "^17.0.0",
-        "@types/react-dom": "^17.0.11",
-        "typescript": "^4.9.4"
+        "@types/react-dom": "^17.0.11"
       },
       "peerDependencies": {
         "react": "^16.9.0 || ^17.0.0"
@@ -196,23 +201,6 @@
         "url": "https://opencollective.com/babel"
       }
     },
-    "node_modules/@babel/eslint-parser": {
-      "version": "7.21.3",
-      "resolved": "https://registry.npmjs.org/@babel/eslint-parser/-/eslint-parser-7.21.3.tgz",
-      "integrity": "sha512-kfhmPimwo6k4P8zxNs8+T7yR44q1LdpsZdE1NkCsVlfiuTPRfnGgjaF8Qgug9q9Pou17u6wneYF0lDCZJATMFg==",
-      "dependencies": {
-        "@nicolo-ribaudo/eslint-scope-5-internals": "5.1.1-v1",
-        "eslint-visitor-keys": "^2.1.0",
-        "semver": "^6.3.0"
-      },
-      "engines": {
-        "node": "^10.13.0 || ^12.13.0 || >=14.0.0"
-      },
-      "peerDependencies": {
-        "@babel/core": ">=7.11.0",
-        "eslint": "^7.5.0 || ^8.0.0"
-      }
-    },
     "node_modules/@babel/generator": {
       "version": "7.21.4",
       "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.21.4.tgz",
@@ -1912,13 +1900,16 @@
       }
     },
     "node_modules/@edx/eslint-config": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/@edx/eslint-config/-/eslint-config-3.2.0.tgz",
-      "integrity": "sha512-X2o34xr3KqmQSV/vJVv6k4FxUKYwbBATHTtTHLTYQvM9PVoM3WbKQP9tl6Z057pRErKzshJcks+4ENzDyhr11Q==",
+      "version": "4.0.0-alpha.1",
+      "resolved": "https://registry.npmjs.org/@edx/eslint-config/-/eslint-config-4.0.0-alpha.1.tgz",
+      "integrity": "sha512-+Hx8r6z+DdwryqluA0MF7S/RCurakzQs4AfNufWu2BLcIaf/Jot19NfcxS4Dzo8WUWiBL+lo4/42fclHHrvk9Q==",
       "peerDependencies": {
-        "eslint": "^6.8.0 || ^7.0.0 || ^8.0.0",
+        "@typescript-eslint/eslint-plugin": "^5.58.0",
+        "@typescript-eslint/parser": "^5.58.0",
+        "eslint": "^7.32.0 || ^8.2.0",
         "eslint-config-airbnb": "^18.0.1 || ^19.0.0",
-        "eslint-plugin-import": "^2.20.0",
+        "eslint-config-airbnb-typescript": "^17.0.0",
+        "eslint-plugin-import": "^2.25.3",
         "eslint-plugin-jsx-a11y": "^6.2.3",
         "eslint-plugin-react": "^7.18.0",
         "eslint-plugin-react-hooks": "^1.7.0 || ^4.0.0"
@@ -1932,6 +1923,16 @@
         "@newrelic/publish-sourcemap": "^5.0.1"
       }
     },
+    "node_modules/@edx/typescript-config": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/@edx/typescript-config/-/typescript-config-1.0.0.tgz",
+      "integrity": "sha512-4Iip/UZyJ/Kn6fMbtzjpltTEssRdaeseYQAxiCeFOp3l5I6/Kt54UTQSYFYZtd8KtKSYNfXNXe1PqsZjYQf55w==",
+      "peerDependencies": {
+        "@types/jest": "^26.0.0",
+        "ts-jest": "^26.5.0",
+        "typescript": "^4.9.4"
+      }
+    },
     "node_modules/@eslint-community/eslint-utils": {
       "version": "4.4.0",
       "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz",
@@ -2944,14 +2945,6 @@
       "integrity": "sha512-s88O1aVtXftvp5bCPB7WnmXc5IwOZZ7YPuwNPt+GtOOXpPvad1LfbmjYv+qII7zP6RU2QGnqve27dnLycEnyEQ==",
       "optional": true
     },
-    "node_modules/@nicolo-ribaudo/eslint-scope-5-internals": {
-      "version": "5.1.1-v1",
-      "resolved": "https://registry.npmjs.org/@nicolo-ribaudo/eslint-scope-5-internals/-/eslint-scope-5-internals-5.1.1-v1.tgz",
-      "integrity": "sha512-54/JRvkLIzzDWshCWfuhadfrfZVPiElY8Fcgmg1HroEly/EDSszzhBAsarCux+D/kOslTRquNzuyGSmUSTTHGg==",
-      "dependencies": {
-        "eslint-scope": "5.1.1"
-      }
-    },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -3495,6 +3488,15 @@
         "@types/istanbul-lib-report": "*"
       }
     },
+    "node_modules/@types/jest": {
+      "version": "26.0.24",
+      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-26.0.24.tgz",
+      "integrity": "sha512-E/X5Vib8BWqZNRlDxj9vYXhsDwPYbPINqKF9BsnSoon4RQ0D9moEuLD8txgyypFLH7J4+Lho9Nr/c8H0Fi+17w==",
+      "dependencies": {
+        "jest-diff": "^26.0.0",
+        "pretty-format": "^26.0.0"
+      }
+    },
     "node_modules/@types/json-schema": {
       "version": "7.0.11",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.11.tgz",
@@ -3591,6 +3593,11 @@
         "schema-utils": "*"
       }
     },
+    "node_modules/@types/semver": {
+      "version": "7.3.13",
+      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.3.13.tgz",
+      "integrity": "sha512-21cFJr9z3g5dW8B0CVI9g2O9beqaThGQ6ZFBqHfwhzLDKUxaqTIy3vnfah/UPkfOiF2pLq+tGz+W8RyCskuslw=="
+    },
     "node_modules/@types/serve-index": {
       "version": "1.9.1",
       "resolved": "https://registry.npmjs.org/@types/serve-index/-/serve-index-1.9.1.tgz",
@@ -3707,6 +3714,322 @@
       "resolved": "https://registry.npmjs.org/@types/yargs-parser/-/yargs-parser-21.0.0.tgz",
       "integrity": "sha512-iO9ZQHkZxHn4mSakYV0vFHAVDyEOIJQrV2uZ06HxEPcx+mt8swXoZHIbaaJ2crJYFfErySgktuTZ3BeLz+XmFA=="
     },
+    "node_modules/@typescript-eslint/eslint-plugin": {
+      "version": "5.58.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.58.0.tgz",
+      "integrity": "sha512-vxHvLhH0qgBd3/tW6/VccptSfc8FxPQIkmNTVLWcCOVqSBvqpnKkBTYrhcGlXfSnd78azwe+PsjYFj0X34/njA==",
+      "dependencies": {
+        "@eslint-community/regexpp": "^4.4.0",
+        "@typescript-eslint/scope-manager": "5.58.0",
+        "@typescript-eslint/type-utils": "5.58.0",
+        "@typescript-eslint/utils": "5.58.0",
+        "debug": "^4.3.4",
+        "grapheme-splitter": "^1.0.4",
+        "ignore": "^5.2.0",
+        "natural-compare-lite": "^1.4.0",
+        "semver": "^7.3.7",
+        "tsutils": "^3.21.0"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "@typescript-eslint/parser": "^5.0.0",
+        "eslint": "^6.0.0 || ^7.0.0 || ^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/semver": {
+      "version": "7.4.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.4.0.tgz",
+      "integrity": "sha512-RgOxM8Mw+7Zus0+zcLEUn8+JfoLpj/huFTItQy2hsM4khuC1HYRDp0cU482Ewn/Fcy6bCjufD8vAj7voC66KQw==",
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
+    "node_modules/@typescript-eslint/parser": {
+      "version": "5.58.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.58.0.tgz",
+      "integrity": "sha512-ixaM3gRtlfrKzP8N6lRhBbjTow1t6ztfBvQNGuRM8qH1bjFFXIJ35XY+FC0RRBKn3C6cT+7VW1y8tNm7DwPHDQ==",
+      "dependencies": {
+        "@typescript-eslint/scope-manager": "5.58.0",
+        "@typescript-eslint/types": "5.58.0",
+        "@typescript-eslint/typescript-estree": "5.58.0",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^6.0.0 || ^7.0.0 || ^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@typescript-eslint/scope-manager": {
+      "version": "5.58.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.58.0.tgz",
+      "integrity": "sha512-b+w8ypN5CFvrXWQb9Ow9T4/6LC2MikNf1viLkYTiTbkQl46CnR69w7lajz1icW0TBsYmlpg+mRzFJ4LEJ8X9NA==",
+      "dependencies": {
+        "@typescript-eslint/types": "5.58.0",
+        "@typescript-eslint/visitor-keys": "5.58.0"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils": {
+      "version": "5.58.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-5.58.0.tgz",
+      "integrity": "sha512-FF5vP/SKAFJ+LmR9PENql7fQVVgGDOS+dq3j+cKl9iW/9VuZC/8CFmzIP0DLKXfWKpRHawJiG70rVH+xZZbp8w==",
+      "dependencies": {
+        "@typescript-eslint/typescript-estree": "5.58.0",
+        "@typescript-eslint/utils": "5.58.0",
+        "debug": "^4.3.4",
+        "tsutils": "^3.21.0"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "*"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@typescript-eslint/types": {
+      "version": "5.58.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.58.0.tgz",
+      "integrity": "sha512-JYV4eITHPzVQMnHZcYJXl2ZloC7thuUHrcUmxtzvItyKPvQ50kb9QXBkgNAt90OYMqwaodQh2kHutWZl1fc+1g==",
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree": {
+      "version": "5.58.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.58.0.tgz",
+      "integrity": "sha512-cRACvGTodA+UxnYM2uwA2KCwRL7VAzo45syNysqlMyNyjw0Z35Icc9ihPJZjIYuA5bXJYiJ2YGUB59BqlOZT1Q==",
+      "dependencies": {
+        "@typescript-eslint/types": "5.58.0",
+        "@typescript-eslint/visitor-keys": "5.58.0",
+        "debug": "^4.3.4",
+        "globby": "^11.1.0",
+        "is-glob": "^4.0.3",
+        "semver": "^7.3.7",
+        "tsutils": "^3.21.0"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/array-union": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
+      "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/globby": {
+      "version": "11.1.0",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz",
+      "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==",
+      "dependencies": {
+        "array-union": "^2.1.0",
+        "dir-glob": "^3.0.1",
+        "fast-glob": "^3.2.9",
+        "ignore": "^5.2.0",
+        "merge2": "^1.4.1",
+        "slash": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/semver": {
+      "version": "7.4.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.4.0.tgz",
+      "integrity": "sha512-RgOxM8Mw+7Zus0+zcLEUn8+JfoLpj/huFTItQy2hsM4khuC1HYRDp0cU482Ewn/Fcy6bCjufD8vAj7voC66KQw==",
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/slash": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
+      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
+    "node_modules/@typescript-eslint/utils": {
+      "version": "5.58.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-5.58.0.tgz",
+      "integrity": "sha512-gAmLOTFXMXOC+zP1fsqm3VceKSBQJNzV385Ok3+yzlavNHZoedajjS4UyS21gabJYcobuigQPs/z71A9MdJFqQ==",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.2.0",
+        "@types/json-schema": "^7.0.9",
+        "@types/semver": "^7.3.12",
+        "@typescript-eslint/scope-manager": "5.58.0",
+        "@typescript-eslint/types": "5.58.0",
+        "@typescript-eslint/typescript-estree": "5.58.0",
+        "eslint-scope": "^5.1.1",
+        "semver": "^7.3.7"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^6.0.0 || ^7.0.0 || ^8.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/utils/node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@typescript-eslint/utils/node_modules/semver": {
+      "version": "7.4.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.4.0.tgz",
+      "integrity": "sha512-RgOxM8Mw+7Zus0+zcLEUn8+JfoLpj/huFTItQy2hsM4khuC1HYRDp0cU482Ewn/Fcy6bCjufD8vAj7voC66KQw==",
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@typescript-eslint/utils/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
+    "node_modules/@typescript-eslint/visitor-keys": {
+      "version": "5.58.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.58.0.tgz",
+      "integrity": "sha512-/fBraTlPj0jwdyTwLyrRTxv/3lnU2H96pNTVM6z3esTWLtA5MZ9ghSMJ7Rb+TtUAdtEw9EyJzJ0EydIMKxQ9gA==",
+      "dependencies": {
+        "@typescript-eslint/types": "5.58.0",
+        "eslint-visitor-keys": "^3.3.0"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/visitor-keys/node_modules/eslint-visitor-keys": {
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.0.tgz",
+      "integrity": "sha512-HPpKPUBQcAsZOsHAFwTtIKcYlCje62XB7SEAcxjtmW6TD1WVpkS6i6/hOVtTZIl4zGj/mBqpFVGvaDneik+VoQ==",
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
     "node_modules/@webassemblyjs/ast": {
       "version": "1.11.1",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.11.1.tgz",
@@ -4893,8 +5216,6 @@
       "version": "0.2.6",
       "resolved": "https://registry.npmjs.org/bs-logger/-/bs-logger-0.2.6.tgz",
       "integrity": "sha512-pd8DCoxmbgc7hyPKOvxtqNcjYoOsABPQdcCUjGp3d42VR2CX1ORhk2A87oqqu5R1kk+76nsxZupkmyd+MVtCog==",
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "fast-json-stable-stringify": "2.x"
       },
@@ -6678,6 +6999,20 @@
         "eslint-plugin-import": "^2.25.2"
       }
     },
+    "node_modules/eslint-config-airbnb-typescript": {
+      "version": "17.0.0",
+      "resolved": "https://registry.npmjs.org/eslint-config-airbnb-typescript/-/eslint-config-airbnb-typescript-17.0.0.tgz",
+      "integrity": "sha512-elNiuzD0kPAPTXjFWg+lE24nMdHMtuxgYoD30OyMD6yrW1AhFZPAg27VX7d3tzOErw+dgJTNWfRSDqEcXb4V0g==",
+      "dependencies": {
+        "eslint-config-airbnb-base": "^15.0.0"
+      },
+      "peerDependencies": {
+        "@typescript-eslint/eslint-plugin": "^5.13.0",
+        "@typescript-eslint/parser": "^5.0.0",
+        "eslint": "^7.32.0 || ^8.2.0",
+        "eslint-plugin-import": "^2.25.3"
+      }
+    },
     "node_modules/eslint-import-resolver-node": {
       "version": "0.3.7",
       "resolved": "https://registry.npmjs.org/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.7.tgz",
@@ -6882,14 +7217,6 @@
         "node": ">=4.0"
       }
     },
-    "node_modules/eslint-visitor-keys": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-2.1.0.tgz",
-      "integrity": "sha512-0rSmRBzXgDzIsD6mGdJgevzgezI534Cer5L/vyMX0kHzT/jiB43jRhd9YUlMGYLQy2zprNmoT8qasCGtY+QaKw==",
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/eslint/node_modules/ansi-styles": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
@@ -11826,9 +12153,7 @@
     "node_modules/make-error": {
       "version": "1.3.6",
       "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
-      "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==",
-      "optional": true,
-      "peer": true
+      "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw=="
     },
     "node_modules/makeerror": {
       "version": "1.0.12",
@@ -12070,6 +12395,11 @@
       "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
       "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw=="
     },
+    "node_modules/natural-compare-lite": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/natural-compare-lite/-/natural-compare-lite-1.4.0.tgz",
+      "integrity": "sha512-Tj+HTDSJJKaZnfiuw+iaF9skdPpTo2GtEly5JHnWV/hfv2Qj/9RKsGISQtLh2ox3l5EAGw487hnBee0sIJ6v2g=="
+    },
     "node_modules/negotiator": {
       "version": "0.6.3",
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz",
@@ -16245,8 +16575,6 @@
       "version": "26.5.6",
       "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-26.5.6.tgz",
       "integrity": "sha512-rua+rCP8DxpA8b4DQD/6X2HQS8Zy/xzViVYfEs2OQu68tkCuKLV0Md8pmX55+W24uRIyAsf/BajRfxOs+R2MKA==",
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "bs-logger": "0.x",
         "buffer-from": "1.x",
@@ -16274,8 +16602,6 @@
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
       "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "yallist": "^4.0.0"
       },
@@ -16287,8 +16613,6 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz",
       "integrity": "sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==",
-      "optional": true,
-      "peer": true,
       "bin": {
         "mkdirp": "bin/cmd.js"
       },
@@ -16300,8 +16624,6 @@
       "version": "7.3.8",
       "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
       "integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
       },
@@ -16315,9 +16637,7 @@
     "node_modules/ts-jest/node_modules/yallist": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "optional": true,
-      "peer": true
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
     },
     "node_modules/tsconfig-paths": {
       "version": "3.14.1",
@@ -16354,6 +16674,25 @@
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz",
       "integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ=="
     },
+    "node_modules/tsutils": {
+      "version": "3.21.0",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-3.21.0.tgz",
+      "integrity": "sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==",
+      "dependencies": {
+        "tslib": "^1.8.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      },
+      "peerDependencies": {
+        "typescript": ">=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta"
+      }
+    },
+    "node_modules/tsutils/node_modules/tslib": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+    },
     "node_modules/tunnel-agent": {
       "version": "0.6.0",
       "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
diff --git a/package.json b/package.json
index 22c6fc3f6..95a65b746 100644
--- a/package.json
+++ b/package.json
@@ -27,17 +27,20 @@
   "dependencies": {
     "@babel/cli": "7.21.0",
     "@babel/core": "7.21.4",
-    "@babel/eslint-parser": "7.21.3",
     "@babel/plugin-proposal-class-properties": "7.18.6",
     "@babel/plugin-proposal-object-rest-spread": "7.20.7",
     "@babel/plugin-syntax-dynamic-import": "7.8.3",
     "@babel/preset-env": "7.21.4",
     "@babel/preset-react": "7.18.6",
-    "@edx/eslint-config": "3.2.0",
+    "@edx/eslint-config": "4.0.0-alpha.1",
     "@edx/new-relic-source-map-webpack-plugin": "1.0.2",
+    "@edx/typescript-config": "^1.0.0",
     "@fullhuman/postcss-purgecss": "^5.0.0",
     "@pmmmwh/react-refresh-webpack-plugin": "0.5.10",
     "@svgr/webpack": "6.5.1",
+    "@types/jest": "^26.0.0",
+    "@typescript-eslint/eslint-plugin": "^5.58.0",
+    "@typescript-eslint/parser": "^5.58.0",
     "autoprefixer": "10.4.14",
     "babel-jest": "26.6.3",
     "babel-loader": "9.1.2",
@@ -51,6 +54,7 @@
     "dotenv-webpack": "7.1.1",
     "eslint": "8.38.0",
     "eslint-config-airbnb": "19.0.4",
+    "eslint-config-airbnb-typescript": "^17.0.0",
     "eslint-plugin-import": "2.27.5",
     "eslint-plugin-jsx-a11y": "6.7.1",
     "eslint-plugin-react": "7.32.2",
@@ -73,6 +77,8 @@
     "sharp": "^0.32.0",
     "source-map-loader": "^4.0.1",
     "style-loader": "3.3.2",
+    "ts-jest": "^26.5.0",
+    "typescript": "^4.9.4",
     "url-loader": "4.1.1",
     "webpack": "5.79.0",
     "webpack-bundle-analyzer": "4.8.0",
@@ -83,8 +89,7 @@
   "devDependencies": {
     "@babel/preset-typescript": "^7.18.6",
     "@types/react": "^17.0.0",
-    "@types/react-dom": "^17.0.11",
-    "typescript": "^4.9.4"
+    "@types/react-dom": "^17.0.11"
   },
   "peerDependencies": {
     "react": "^16.9.0 || ^17.0.0"
diff --git a/tsconfig.json b/tsconfig.json
new file mode 100644
index 000000000..e45277eae
--- /dev/null
+++ b/tsconfig.json
@@ -0,0 +1,22 @@
+{
+  "extends": "@edx/typescript-config",
+  "compilerOptions": {
+    "rootDir": ".",
+    "outDir": "dist"
+  },
+  "include": [
+    ".eslintrc.js",
+    "config/.eslintrc.js",
+    "example/.eslintrc.js",
+    "example/**/*",
+    "lib",
+    "bin",
+    "config"
+  ],
+  "exclude": [
+    "node_modules",
+    "dist",
+    "example/dist/*",
+    "example/node_modules/*'"
+  ]
+}