feat: update dependencies

package.json

@@ -31,29 +31,29 @@
   ],
   "dependencies": {
     "@asyncapi/parser": "^3.0.10",
-    "@babel/core": "7.12.9",
-    "@babel/preset-env": "^7.12.7",
-    "@babel/preset-react": "^7.12.7",
-    "@rollup/plugin-babel": "^5.2.1",
-    "babel-plugin-source-map-support": "^2.1.3",
-    "prop-types": "^15.7.2",
-    "react": "^17.0.1",
-    "rollup": "^2.60.1",
-    "source-map-support": "^0.5.19"
+    "@babel/core": "7.24.3",
+    "@babel/preset-env": "^7.24.3",
+    "@babel/preset-react": "^7.24.1",
+    "@rollup/plugin-babel": "^6.0.4",
+    "babel-plugin-source-map-support": "^2.2.0",
+    "prop-types": "^15.8.1",
+    "react": "^18.2.0",
+    "rollup": "^4.13.0",
+    "source-map-support": "^0.5.21"
   },
   "devDependencies": {
-    "@types/jest": "^26.0.15",
-    "@types/react": "^17.0.0",
-    "cross-env": "^7.0.2",
-    "eslint": "^8.46.0",
-    "eslint-plugin-react": "^7.33.1",
-    "eslint-plugin-security": "^1.7.1",
-    "eslint-plugin-sonarjs": "^0.20.0",
-    "jest": "^26.6.3",
-    "jsdoc-to-markdown": "^8.0.0",
+    "@types/jest": "^29.5.12",
+    "@types/react": "^18.2.67",
+    "cross-env": "^7.0.3",
+    "eslint": "^8.57.0",
+    "eslint-plugin-react": "^7.34.1",
+    "eslint-plugin-security": "^2.1.1",
+    "eslint-plugin-sonarjs": "^0.24.0",
+    "jest": "^29.7.0",
+    "jsdoc-to-markdown": "^8.0.1",
     "markdown-toc": "^1.2.0",
-    "ts-jest": "^26.4.4",
-    "typescript": "^4.1.2"
+    "ts-jest": "^29.1.2",
+    "typescript": "^5.4.3"
   },
   "scripts": {
     "start": "tsc --watch",

src/components/File.tsx

@@ -1,4 +1,5 @@
 import PropTypes from 'prop-types';
+import { PropsWithChildren } from 'react';
 
 import { FunctionComponent } from "../types";
 
@@ -35,7 +36,7 @@ export const FilePropTypes = {
  *   <File name={name} permissions={permissions}>Test</File>
  * )
  */
-const File: FunctionComponent<FileProps> = ({ children }) => {
+const File: FunctionComponent<PropsWithChildren<FileProps>> = ({ children }) => {
   return <>{children}</>;
 };
 

src/components/Indent.tsx

@@ -1,4 +1,5 @@
 import PropTypes from 'prop-types';
+import { PropsWithChildren } from 'react';
 
 import { IndentationTypes, withIndendation } from "../utils";
 import { FunctionComponent } from "../types";
@@ -38,7 +39,7 @@ export const IndentPropTypes = {
  *   <Indent size={size} type={type}>test</Indent>
  * )
  */
-const Indent: FunctionComponent<IndentProps> = ({ size = 0, type = IndentationTypes.SPACES, childrenContent }) => {
+const Indent: FunctionComponent<PropsWithChildren<IndentProps>> = ({ size = 0, type = IndentationTypes.SPACES, childrenContent }) => {
   return <>{withIndendation(childrenContent, size, type)}</>;
 };
 

src/components/Text.tsx

@@ -1,4 +1,5 @@
 import PropTypes from 'prop-types';
+import { PropsWithChildren } from 'react';
 
 import { IndentationTypes, withIndendation, withNewLines } from "../utils";
 import { FunctionComponent } from "../types";
@@ -45,7 +46,7 @@ export const TextPropTypes = {
  *   <Text indent={size} type={type} newLines={newLines}>Test</Text>
  * )
  */
-const Text: FunctionComponent<TextProps> = ({ indent = 0, type = IndentationTypes.SPACES, newLines = 1, childrenContent }) => {
+const Text: FunctionComponent<PropsWithChildren<TextProps>> = ({ indent = 0, type = IndentationTypes.SPACES, newLines = 1, childrenContent }) => {
   const contentWithLines = withNewLines(childrenContent, newLines);
   return <>{withIndendation(contentWithLines, indent, type)}</>;
 };

src/renderer/__tests__/renderer.spec.tsx

@@ -129,14 +129,8 @@ describe('Renderer', () => {
       return null;
     }
 
-    let error = undefined;
-    try {
-      render(<Component />);
-    } catch(err) {
-      error = err;
-    }
-    // check substring of the desired error
-    expect((error as Error).message).toContain('Invalid hook call.');
+    // A console.error() will be printed due to illegal use of hooks but only in development mode
+    expect(() => render(<Component />)).toThrow("Cannot read properties of null (reading 'useState')");
   });
 
   test('should skips internal React components', () => {
@@ -161,13 +155,6 @@ describe('Renderer', () => {
       )
     }
 
-    let error = undefined;
-    try {
-      render(<Component />);
-    } catch(err) {
-      error = err;
-    }
-    // check substring of the desired error
-    expect((error as Error).message).toEqual('HTML tags is not supported yet.');
+    expect(() => render(<Component />)).toThrow('HTML tags is not supported yet.');
   });
 });

src/transpiler/__tests__/__snapshots__/transpiler.spec.tsx.snap

@@ -3,23 +3,15 @@
 exports[`Transpiler should keep names of files, even if special chars with a simple setup and import correctly 1`] = `
 "'use strict';
 
-var jsxRuntime = require('react/cjs/react-jsx-runtime.production.min');
 require('source-map-support/register');
 var path = require('path');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var path__default = /*#__PURE__*/_interopDefaultLegacy(path);
-
-// eslint-disable-next-line security/detect-non-literal-require, no-undef
+var jsxRuntime = require('react/jsx-runtime');
 
 const {
   File
-} = require(path__default[\\"default\\"].resolve(__dirname, '../../../../components'));
-
-const greetings = name => \`hello \${name}\`; // eslint-disable-next-line react/display-name
-
-
+} = require(path.resolve(__dirname, '../../../../components'));
+const greetings = name => \`hello \${name}\`;
+// eslint-disable-next-line react/display-name
 function $$simple$$ () {
   return /*#__PURE__*/jsxRuntime.jsx(File, {
     children: greetings('Test')
@@ -31,28 +23,25 @@ module.exports = $$simple$$;
 "
 `;
 
-exports[`Transpiler should keep names of files, even if special chars with a simple setup and import correctly 2`] = `"{\\"version\\":3,\\"file\\":\\"$$simple$$.js\\",\\"sources\\":[\\"../../testfiles/SpecialChars/$$simple$$.js\\"],\\"sourcesContent\\":[\\"import path from 'path';\\\\n// this weird import are only necessary because we test within the SDK itself.\\\\n// eslint-disable-next-line security/detect-non-literal-require, no-undef\\\\nconst {File} = require(path.resolve(__dirname, '../../../../components'));\\\\nconst greetings = name => \`hello \${name}\`;\\\\n// eslint-disable-next-line react/display-name\\\\nexport default function() {\\\\n  return (\\\\n    <File>\\\\n      {greetings('Test')}\\\\n    </File>\\\\n  );\\\\n}\\"],\\"names\\":[\\"File\\",\\"require\\",\\"path\\",\\"resolve\\",\\"__dirname\\",\\"greetings\\",\\"name\\",\\"_jsx\\"],\\"mappings\\":\\";;;;;;;;;;AAEA;;AACA,MAAM;AAACA,EAAAA;AAAD,IAASC,OAAO,CAACC,wBAAI,CAACC,OAAL,CAAaC,SAAb,EAAwB,wBAAxB,CAAD,CAAtB;;AACA,MAAMC,SAAS,GAAGC,IAAI,IAAK,SAAQA,IAAK,EAAxC;;;AAEe,uBAAW;AACxB,sBACEC,eAAC,IAAD;AAAA,cACGF,SAAS,CAAC,MAAD;AADZ,IADF;AAKD;;;;\\"}"`;
+exports[`Transpiler should keep names of files, even if special chars with a simple setup and import correctly 2`] = `"{"version":3,"file":"$$simple$$.js","sources":["../../testfiles/SpecialChars/$$simple$$.js"],"sourcesContent":["import path from 'path';\\n// this weird import are only necessary because we test within the SDK itself.\\n// eslint-disable-next-line security/detect-non-literal-require, no-undef\\nconst {File} = require(path.resolve(__dirname, '../../../../components'));\\nconst greetings = name => \`hello \${name}\`;\\n// eslint-disable-next-line react/display-name\\nexport default function() {\\n  return (\\n    <File>\\n      {greetings('Test')}\\n    </File>\\n  );\\n}"],"names":["File","require","path","resolve","__dirname","greetings","name","_jsx","children"],"mappings":";;;;;;AAGA,MAAM;AAACA,EAAAA,IAAAA;AAAI,CAAC,GAAGC,OAAO,CAACC,IAAI,CAACC,OAAO,CAACC,SAAS,EAAE,wBAAwB,CAAC,CAAC,CAAA;AACzE,MAAMC,SAAS,GAAGC,IAAI,IAAK,CAAA,MAAA,EAAQA,IAAK,CAAC,CAAA,CAAA;AACzC;AACe,mBAAW,IAAA;EACxB,oBACEC,cAAA,CAACP,IAAI,EAAA;IAAAQ,QAAA,EACFH,SAAS,CAAC,MAAM,CAAA;AAAC,GACd,CAAC,CAAA;AAEX;;;;"}"`;
 
 exports[`Transpiler should transpile CommonJS files with a simple setup and import correctly 1`] = `
 "'use strict';
 
-var jsxRuntime = require('react/cjs/react-jsx-runtime.production.min');
 require('source-map-support/register');
+var jsxRuntime = require('react/jsx-runtime');
 
 /* eslint-disable no-undef */
-const path = require('path'); // this weird import are only necessary because we test within the SDK itself.
+const path = require('path');
+// this weird import are only necessary because we test within the SDK itself.
 // eslint-disable-next-line security/detect-non-literal-require
-
-
 const {
   File
 } = require(path.resolve(__dirname, '../../../../components'));
-
 function greetings(name) {
   return \`hello \${name}\`;
-} // eslint-disable-next-line react/display-name
-
-
+}
+// eslint-disable-next-line react/display-name
 module.exports = function () {
   return /*#__PURE__*/jsxRuntime.jsx(File, {
     children: greetings('Test')
@@ -62,30 +51,22 @@ module.exports = function () {
 "
 `;
 
-exports[`Transpiler should transpile CommonJS files with a simple setup and import correctly 2`] = `"{\\"version\\":3,\\"file\\":\\"simple.js\\",\\"sources\\":[\\"../../testfiles/CommonJS/simple.js\\"],\\"sourcesContent\\":[\\"/* eslint-disable no-undef */\\\\nconst path = require('path');\\\\n// this weird import are only necessary because we test within the SDK itself.\\\\n// eslint-disable-next-line security/detect-non-literal-require\\\\nconst {File} = require(path.resolve(__dirname, '../../../../components'));\\\\nfunction greetings(name) {\\\\n  return \`hello \${name}\`;\\\\n}\\\\n// eslint-disable-next-line react/display-name\\\\nmodule.exports = function() {\\\\n  return (\\\\n    <File>\\\\n      {greetings('Test')}\\\\n    </File>\\\\n  );\\\\n};\\"],\\"names\\":[\\"path\\",\\"require\\",\\"File\\",\\"resolve\\",\\"__dirname\\",\\"greetings\\",\\"name\\",\\"module\\",\\"exports\\",\\"_jsx\\"],\\"mappings\\":\\";;;;;AAAA;AACA,MAAMA,IAAI,GAAGC,OAAO,CAAC,MAAD,CAApB;AAEA;;;AACA,MAAM;AAACC,EAAAA;AAAD,IAASD,OAAO,CAACD,IAAI,CAACG,OAAL,CAAaC,SAAb,EAAwB,wBAAxB,CAAD,CAAtB;;AACA,SAASC,SAAT,CAAmBC,IAAnB,EAAyB;AACvB,SAAQ,SAAQA,IAAK,EAArB;AACD;;;AAEDC,MAAM,CAACC,OAAP,GAAiB,YAAW;AAC1B,sBACEC,eAAC,IAAD;AAAA,cACGJ,SAAS,CAAC,MAAD;AADZ,IADF;AAKD,CAND;;\\"}"`;
+exports[`Transpiler should transpile CommonJS files with a simple setup and import correctly 2`] = `"{"version":3,"file":"simple.js","sources":["../../testfiles/CommonJS/simple.js"],"sourcesContent":["/* eslint-disable no-undef */\\nconst path = require('path');\\n// this weird import are only necessary because we test within the SDK itself.\\n// eslint-disable-next-line security/detect-non-literal-require\\nconst {File} = require(path.resolve(__dirname, '../../../../components'));\\nfunction greetings(name) {\\n  return \`hello \${name}\`;\\n}\\n// eslint-disable-next-line react/display-name\\nmodule.exports = function() {\\n  return (\\n    <File>\\n      {greetings('Test')}\\n    </File>\\n  );\\n};"],"names":["path","require","File","resolve","__dirname","greetings","name","module","exports","_jsx","children"],"mappings":";;;;;AAAA;AACA,MAAMA,IAAI,GAAGC,OAAO,CAAC,MAAM,CAAC,CAAA;AAC5B;AACA;AACA,MAAM;AAACC,EAAAA,IAAAA;AAAI,CAAC,GAAGD,OAAO,CAACD,IAAI,CAACG,OAAO,CAACC,SAAS,EAAE,wBAAwB,CAAC,CAAC,CAAA;AACzE,SAASC,SAASA,CAACC,IAAI,EAAE;EACvB,OAAQ,CAAA,MAAA,EAAQA,IAAK,CAAC,CAAA,CAAA;AACxB,CAAA;AACA;AACAC,MAAM,CAACC,OAAO,GAAG,YAAW;EAC1B,oBACEC,cAAA,CAACP,IAAI,EAAA;IAAAQ,QAAA,EACFL,SAAS,CAAC,MAAM,CAAA;AAAC,GACd,CAAC,CAAA;AAEX,CAAC;;"}"`;
 
 exports[`Transpiler should transpile ES5 files with a simple setup and import correctly 1`] = `
 "'use strict';
 
-var jsxRuntime = require('react/cjs/react-jsx-runtime.production.min');
 require('source-map-support/register');
 var path = require('path');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var path__default = /*#__PURE__*/_interopDefaultLegacy(path);
-
-// eslint-disable-next-line security/detect-non-literal-require, no-undef
+var jsxRuntime = require('react/jsx-runtime');
 
 const {
   File
-} = require(path__default[\\"default\\"].resolve(__dirname, '../../../../components'));
-
+} = require(path.resolve(__dirname, '../../../../components'));
 function greetings(name) {
   return \`hello \${name}\`;
-} // eslint-disable-next-line react/display-name
-
-
+}
+// eslint-disable-next-line react/display-name
 function simple () {
   return /*#__PURE__*/jsxRuntime.jsx(File, {
     children: greetings('Test')
@@ -97,28 +78,20 @@ module.exports = simple;
 "
 `;
 
-exports[`Transpiler should transpile ES5 files with a simple setup and import correctly 2`] = `"{\\"version\\":3,\\"file\\":\\"simple.js\\",\\"sources\\":[\\"../../testfiles/ES5/simple.js\\"],\\"sourcesContent\\":[\\"import path from 'path';\\\\n// this weird import are only necessary because we test within the SDK itself.\\\\n// eslint-disable-next-line security/detect-non-literal-require, no-undef\\\\nconst {File} = require(path.resolve(__dirname, '../../../../components'));\\\\nfunction greetings(name) {\\\\n  return \`hello \${name}\`;\\\\n}\\\\n// eslint-disable-next-line react/display-name\\\\nexport default function() {\\\\n  return (\\\\n    <File>\\\\n      {greetings('Test')}\\\\n    </File>\\\\n  );\\\\n}\\"],\\"names\\":[\\"File\\",\\"require\\",\\"path\\",\\"resolve\\",\\"__dirname\\",\\"greetings\\",\\"name\\",\\"_jsx\\"],\\"mappings\\":\\";;;;;;;;;;AAEA;;AACA,MAAM;AAACA,EAAAA;AAAD,IAASC,OAAO,CAACC,wBAAI,CAACC,OAAL,CAAaC,SAAb,EAAwB,wBAAxB,CAAD,CAAtB;;AACA,SAASC,SAAT,CAAmBC,IAAnB,EAAyB;AACvB,SAAQ,SAAQA,IAAK,EAArB;AACD;;;AAEc,mBAAW;AACxB,sBACEC,eAAC,IAAD;AAAA,cACGF,SAAS,CAAC,MAAD;AADZ,IADF;AAKD;;;;\\"}"`;
+exports[`Transpiler should transpile ES5 files with a simple setup and import correctly 2`] = `"{"version":3,"file":"simple.js","sources":["../../testfiles/ES5/simple.js"],"sourcesContent":["import path from 'path';\\n// this weird import are only necessary because we test within the SDK itself.\\n// eslint-disable-next-line security/detect-non-literal-require, no-undef\\nconst {File} = require(path.resolve(__dirname, '../../../../components'));\\nfunction greetings(name) {\\n  return \`hello \${name}\`;\\n}\\n// eslint-disable-next-line react/display-name\\nexport default function() {\\n  return (\\n    <File>\\n      {greetings('Test')}\\n    </File>\\n  );\\n}"],"names":["File","require","path","resolve","__dirname","greetings","name","_jsx","children"],"mappings":";;;;;;AAGA,MAAM;AAACA,EAAAA,IAAAA;AAAI,CAAC,GAAGC,OAAO,CAACC,IAAI,CAACC,OAAO,CAACC,SAAS,EAAE,wBAAwB,CAAC,CAAC,CAAA;AACzE,SAASC,SAASA,CAACC,IAAI,EAAE;EACvB,OAAQ,CAAA,MAAA,EAAQA,IAAK,CAAC,CAAA,CAAA;AACxB,CAAA;AACA;AACe,eAAW,IAAA;EACxB,oBACEC,cAAA,CAACP,IAAI,EAAA;IAAAQ,QAAA,EACFH,SAAS,CAAC,MAAM,CAAA;AAAC,GACd,CAAC,CAAA;AAEX;;;;"}"`;
 
 exports[`Transpiler should transpile ES6 files with a simple setup and import correctly 1`] = `
 "'use strict';
 
-var jsxRuntime = require('react/cjs/react-jsx-runtime.production.min');
 require('source-map-support/register');
 var path = require('path');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var path__default = /*#__PURE__*/_interopDefaultLegacy(path);
-
-// eslint-disable-next-line security/detect-non-literal-require, no-undef
+var jsxRuntime = require('react/jsx-runtime');
 
 const {
   File
-} = require(path__default[\\"default\\"].resolve(__dirname, '../../../../components'));
-
-const greetings = name => \`hello \${name}\`; // eslint-disable-next-line react/display-name
-
-
+} = require(path.resolve(__dirname, '../../../../components'));
+const greetings = name => \`hello \${name}\`;
+// eslint-disable-next-line react/display-name
 function simple () {
   return /*#__PURE__*/jsxRuntime.jsx(File, {
     children: greetings('Test')
@@ -130,4 +103,4 @@ module.exports = simple;
 "
 `;
 
-exports[`Transpiler should transpile ES6 files with a simple setup and import correctly 2`] = `"{\\"version\\":3,\\"file\\":\\"simple.js\\",\\"sources\\":[\\"../../testfiles/ES6/simple.js\\"],\\"sourcesContent\\":[\\"import path from 'path';\\\\n// this weird import are only necessary because we test within the SDK itself.\\\\n// eslint-disable-next-line security/detect-non-literal-require, no-undef\\\\nconst {File} = require(path.resolve(__dirname, '../../../../components'));\\\\nconst greetings = name => \`hello \${name}\`;\\\\n// eslint-disable-next-line react/display-name\\\\nexport default function() {\\\\n  return (\\\\n    <File>\\\\n      {greetings('Test')}\\\\n    </File>\\\\n  );\\\\n}\\"],\\"names\\":[\\"File\\",\\"require\\",\\"path\\",\\"resolve\\",\\"__dirname\\",\\"greetings\\",\\"name\\",\\"_jsx\\"],\\"mappings\\":\\";;;;;;;;;;AAEA;;AACA,MAAM;AAACA,EAAAA;AAAD,IAASC,OAAO,CAACC,wBAAI,CAACC,OAAL,CAAaC,SAAb,EAAwB,wBAAxB,CAAD,CAAtB;;AACA,MAAMC,SAAS,GAAGC,IAAI,IAAK,SAAQA,IAAK,EAAxC;;;AAEe,mBAAW;AACxB,sBACEC,eAAC,IAAD;AAAA,cACGF,SAAS,CAAC,MAAD;AADZ,IADF;AAKD;;;;\\"}"`;
+exports[`Transpiler should transpile ES6 files with a simple setup and import correctly 2`] = `"{"version":3,"file":"simple.js","sources":["../../testfiles/ES6/simple.js"],"sourcesContent":["import path from 'path';\\n// this weird import are only necessary because we test within the SDK itself.\\n// eslint-disable-next-line security/detect-non-literal-require, no-undef\\nconst {File} = require(path.resolve(__dirname, '../../../../components'));\\nconst greetings = name => \`hello \${name}\`;\\n// eslint-disable-next-line react/display-name\\nexport default function() {\\n  return (\\n    <File>\\n      {greetings('Test')}\\n    </File>\\n  );\\n}"],"names":["File","require","path","resolve","__dirname","greetings","name","_jsx","children"],"mappings":";;;;;;AAGA,MAAM;AAACA,EAAAA,IAAAA;AAAI,CAAC,GAAGC,OAAO,CAACC,IAAI,CAACC,OAAO,CAACC,SAAS,EAAE,wBAAwB,CAAC,CAAC,CAAA;AACzE,MAAMC,SAAS,GAAGC,IAAI,IAAK,CAAA,MAAA,EAAQA,IAAK,CAAC,CAAA,CAAA;AACzC;AACe,eAAW,IAAA;EACxB,oBACEC,cAAA,CAACP,IAAI,EAAA;IAAAQ,QAAA,EACFH,SAAS,CAAC,MAAM,CAAA;AAAC,GACd,CAAC,CAAA;AAEX;;;;"}"`;

src/transpiler/__tests__/transpiler.spec.tsx

@@ -13,16 +13,10 @@ describe('Transpiler', () => {
   const testFiles = path.resolve(__dirname, './testfiles');
   const outputFiles = path.resolve(__dirname, './__transpiled_testfiles');
 
-  beforeAll(async (done) => {
-    try {
-      await transpileFiles(testFiles, outputFiles, {
-        recursive: true
-      });
-      done();
-    } catch (e) {
-      console.log(e);
-      done(e);
-    }
+  beforeAll(async () => {
+    await transpileFiles(testFiles, outputFiles, {
+      recursive: true
+    });
   });
 
   describe('should transpile CommonJS files', () => {

src/transpiler/transpiler.ts

@@ -51,9 +51,6 @@ export async function transpileFiles(directory: string, outputDir: string, optio
             sourcemap: true,
             dir: outputDir,
             exports: "auto",
-            paths: {
-              'react/jsx-runtime': 'react/cjs/react-jsx-runtime.production.min',
-            },
             sanitizeFileName: false,
         })
     }