Error when importing a react module when using either Jest or Mocha for testing

Currently, I'm trying to unit test some react components, but I am hitting issues when importing react modules.

The error I'm hitting is the following

    C:\Users\Andrew.Urry\source\Workspaces\Empower\PlatformAdmin\Portal\node_modules\mpx-error-boundary\ErrorBoundary.js:2
    import * as React from 'react';
    ^^^^^^

    SyntaxError: Cannot use import statement outside a module

       6 | import { PageHeader } from './SubMenu';
       7 | import { msg } from 'mpx-multi-language';
    >  8 | import { ErrorBoundary } from 'mpx-error-boundary';

jest.config.js file is the following:

module.exports = {
    "roots": [
        "<rootDir>/wwwroot/ts-tests"
    ],
    "testMatch": [
        "**/__tests__/**/*.+(ts|tsx|js)",
        "**/?(*.)+(spec|test).+(ts|tsx|js)"
    ],
    "transform": {
        "^.+\\.(ts|tsx)$": "ts-jest"
    },
}

package.json file is the following:

{
  "name": "app",
  "version": "1.0.0",
  "private": true,
  "devDependencies": {
    "@babel/cli": "^7.8.4",
    "@babel/core": "^7.9.0",
    "@babel/node": "^7.8.7",
    "@babel/preset-env": "^7.9.0",
    "@babel/preset-react": "^7.10.1",
    "@babel/preset-typescript": "^7.9.0",
    "@babel/plugin-proposal-class-properties": "^7.10.4",
    "@babel/plugin-transform-modules-commonjs": "^7.10.4",
    "@babel/register": "^7.9.0",
    "@types/bootstrap": "4.3.2",
    "@types/chai": "^4.2.0",
    "@types/enzyme-adapter-react-16": "^1.0.6",
    "@types/jquery": "^3.5.0",
    "@types/mocha": "^7.0.2",
    "@types/react": "^16.9.31",
    "@types/react-dom": "^16.9.6",
    "@types/sinon": "^9.0.4",
    "@types/jest": "26.0.10",
    "babel-loader": "^8.1.0",
    "chai": "^4.2.0",
    "clean-webpack-plugin": "^3.0.0",
    "css-loader": "^3.6.0",
    "enzyme": "^3.11.0",
    "enzyme-adapter-react-16": "^1.15.2",
    "esm": "3.2.25",
    "file-loader": "^6.0.0",
    "hard-source-webpack-plugin": "^0.13.1",
    "html-webpack-plugin": "^4.3.0",
    "image-webpack-loader": "^6.0.0",
    "jsdom": "^16.3.0",
    "mini-css-extract-plugin": "^0.9.0",
    "mocha": "^8.1.1",
    "node-sass": "^4.14.1",
    "optimize-css-assets-webpack-plugin": "^5.0.3",
    "sinon": "^9.0.2",
    "sinon-chai": "3.5.0",
    "terser-webpack-plugin": "^3.0.6",
    "ts-loader": "^7.0.5",
    "ts-mockito": "^2.5.0",
    "ts-jest": "26.2.0",
    "typescript": "3.8.3",
    "webpack": "^4.43.0",
    "webpack-cli": "^3.3.12",
    "ignore-styles": "^5.0.1",
    "ts-node-register": "1.0.0",
    "jest": "26.4.0"
  },
  "dependencies": {
    "@fortawesome/fontawesome-free": "^5.13.1",
    "@material-ui/core": "^4.11.0",
    "bootstrap": "^4.3.1",
    "bootstrap-table": "^1.16.0",
    "file-saver": "^2.0.2",
    "jquery": "^3.3.1",
    "jquery-validation": "^1.17.0",
    "jquery-validation-unobtrusive": "^3.2.11",
    "material-table": "^1.68.0",
    "moment": "^2.26.0",
    "mpx-dialog": "^1.1.12",
    "mpx-error-boundary": "^1.0.0",
    "mpx-multi-language": "^1.0.8",
    "mpx-react-page-components": "^1.0.6",
    "mpx-utilities": "^1.0.1",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "tableexport.jquery.plugin": "^1.10.20"
  },
  "babel": {
    "presets": [
      "@babel/preset-env",
      "@babel/preset-react",
      "@babel/preset-typescript"
    ],
    "plugins": [
      "@babel/plugin-proposal-class-properties",
      "@babel/plugin-transform-modules-commonjs"
    ],
    "transformIgnorePatterns": [
      "node_modules/mpx-error-boundary/"
    ]
  },
  "jest": {
    "moduleNameMapper": {
      "\\.(css|less)$": "identity-obj-proxy"
    },
    "transform": {
      "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/fileTransformer.js"
    }
  },
  "mocha": {
    "extension": [
      "ts",
      "tsx"
    ],
    "spec": "wwwroot/ts-tests/**/*.test.tsx",
    "require": [
      "wwwroot/ts-tests/babel-register.js",
      "ignore-styles"
    ]
  },
  "scripts": {
    "test": "jest",
    "pack-dev": "webpack --mode development --progress",
    "pack-dev-profile": "webpack --mode development --verbose --profile --progress",
    "pack-prod": "webpack --mode production",
    "pack-library": "webpack --mode production --config webpack.library.config.js",
    "clean": "del /Q /F .\\wwwroot\\dist\\*.*"
  }
}

babel-register.js file is the following:

/* Copyright (©) Metapraxis Ltd, 2020 - 2020, all rights reserved */

// This cannot be done on the command line or in package.json due to this issue:
// https://github.com/babel/babel/issues/8962

const register = require('@babel/register').default;
register({
    extensions: ['.ts', '.tsx', '.js', '.jsx']
});

tsconfig.json is the following:

{
    "compileOnSave": false,
    "compilerOptions": {
        "noImplicitAny": false,
        "noEmitOnError": true,
        "removeComments": false,
        "sourceMap": true,
        "allowUmdGlobalAccess": true,
        "target": "ES6",
        "module": "ES6",
        "moduleResolution": "Node",
        "jsx": "react",
        "allowSyntheticDefaultImports": true,
        "esModuleInterop": true
    },
    "exclude": [
        "node_modules"
    ],
    "include": [
        "./../Abstractions/*.d.ts",
        "./../Abstractions/**/*.d.ts",
        "./Models/*.d.ts",
        "./wwwroot/ts/*",
        "./wwwroot/ts-tests/**/*.test.ts",
        "./wwwroot/ts-tests/**/*.test.tsx"
    ]
}

I believe it's an issue with a mismatch between import styles, but I haven't been able to fix the issue. The package.json includes mocha, but it is currently using jest to test. Both mocha and jest hit the same issue, so it must be independent to the testing framework.

Any help on the matter would be greatly appreciated

EDIT #1: The import it's complaining about is present in an external NPM package

EDIT #2: I believe the issue is related to babel not transpiling the ES6 module to ES5 for testing