diff --git a/packages/mermaid/src/diagrams/info/info.spec.js b/packages/mermaid/src/diagrams/info/info.spec.js
deleted file mode 100644
index 6f1a59d1c..000000000
--- a/packages/mermaid/src/diagrams/info/info.spec.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import { parser } from './parser/info.jison';
-import infoDb from './infoDb.js';
-describe('when parsing an info graph it', function () {
-  let ex;
-  beforeEach(function () {
-    ex = parser;
-    ex.yy = infoDb;
-  });
-
-  it('should handle an info definition', function () {
-    let str = `info
-    showInfo`;
-
-    ex.parse(str);
-  });
-});
diff --git a/packages/mermaid/src/diagrams/info/info.spec.ts b/packages/mermaid/src/diagrams/info/info.spec.ts
new file mode 100644
index 000000000..cccd74cc6
--- /dev/null
+++ b/packages/mermaid/src/diagrams/info/info.spec.ts
@@ -0,0 +1,24 @@
+// @ts-ignore Jison doesn't export types
+import { parser } from './parser/info.jison';
+import infoDb from './infoDb.js';
+
+describe('info graph', () => {
+  beforeEach(() => {
+    parser.yy = infoDb;
+    parser.yy.clear();
+  });
+
+  it('should handle an info definition', () => {
+    const str = `info`;
+    parser.parse(str);
+
+    expect(infoDb.getInfo()).toBeFalsy();
+  });
+
+  it('should handle an info definition with showInfo', () => {
+    const str = `info showInfo`;
+    parser.parse(str);
+
+    expect(infoDb.getInfo()).toBeTruthy();
+  });
+});
diff --git a/packages/mermaid/src/diagrams/info/infoDb.js b/packages/mermaid/src/diagrams/info/infoDb.js
deleted file mode 100644
index 81ba8057f..000000000
--- a/packages/mermaid/src/diagrams/info/infoDb.js
+++ /dev/null
@@ -1,36 +0,0 @@
-/** Created by knut on 15-01-14. */
-import { log } from '../../logger.js';
-import { clear } from '../../commonDb.js';
-
-var message = '';
-var info = false;
-
-export const setMessage = (txt) => {
-  log.debug('Setting message to: ' + txt);
-  message = txt;
-};
-
-export const getMessage = () => {
-  return message;
-};
-
-export const setInfo = (inf) => {
-  info = inf;
-};
-
-export const getInfo = () => {
-  return info;
-};
-
-// export const parseError = (err, hash) => {
-//   global.mermaidAPI.parseError(err, hash)
-// }
-
-export default {
-  setMessage,
-  getMessage,
-  setInfo,
-  getInfo,
-  clear,
-  // parseError
-};
diff --git a/packages/mermaid/src/diagrams/info/infoDb.ts b/packages/mermaid/src/diagrams/info/infoDb.ts
new file mode 100644
index 000000000..50c31de47
--- /dev/null
+++ b/packages/mermaid/src/diagrams/info/infoDb.ts
@@ -0,0 +1,19 @@
+/** Created by knut on 15-01-14. */
+import { clear } from '../../commonDb.js';
+import { InfoDb } from './infoTypes.js';
+
+let info = false;
+
+export const setInfo = (inf: boolean): void => {
+  info = inf;
+};
+
+export const getInfo = (): boolean => info;
+
+const db: InfoDb = {
+  clear,
+  setInfo,
+  getInfo,
+};
+
+export default db;
diff --git a/packages/mermaid/src/diagrams/info/infoDiagram.ts b/packages/mermaid/src/diagrams/info/infoDiagram.ts
index a26e915e5..574a0d63f 100644
--- a/packages/mermaid/src/diagrams/info/infoDiagram.ts
+++ b/packages/mermaid/src/diagrams/info/infoDiagram.ts
@@ -2,12 +2,11 @@ import { DiagramDefinition } from '../../diagram-api/types.js';
 // @ts-ignore: TODO Fix ts errors
 import parser from './parser/info.jison';
 import db from './infoDb.js';
-import styles from './styles.js';
 import renderer from './infoRenderer.js';
 
 export const diagram: DiagramDefinition = {
-  parser,
-  db,
-  renderer,
-  styles,
+  parser: parser,
+  db: db,
+  renderer: renderer,
+  styles: () => '',
 };
diff --git a/packages/mermaid/src/diagrams/info/infoRenderer.js b/packages/mermaid/src/diagrams/info/infoRenderer.ts
similarity index 71%
rename from packages/mermaid/src/diagrams/info/infoRenderer.js
rename to packages/mermaid/src/diagrams/info/infoRenderer.ts
index 9441a3226..6aac69dbf 100644
--- a/packages/mermaid/src/diagrams/info/infoRenderer.js
+++ b/packages/mermaid/src/diagrams/info/infoRenderer.ts
@@ -1,19 +1,19 @@
 /** Created by knut on 14-12-11. */
+// @ts-ignore - TODO: why
 import { select } from 'd3';
 import { log } from '../../logger.js';
 import { getConfig } from '../../config.js';
+import { DrawDefinition } from '../../diagram-api/types.js';
 
 /**
  * Draws a an info picture in the tag with id: id based on the graph definition in text.
  *
- * @param {any} text
- * @param {any} id
- * @param {any} version
+ * @param text - The text of the diagram.
+ * @param id - The id of the diagram which will be used as a DOM element id.
+ * @param version - MermaidJS version.
  */
-export const draw = (text, id, version) => {
+export const draw: DrawDefinition = (text, id, version) => {
   try {
-    // const parser = infoParser.parser;
-    // parser.yy = db;
     log.debug('Rendering info diagram\n' + text);
 
     const securityLevel = getConfig().securityLevel;
@@ -27,10 +27,6 @@ export const draw = (text, id, version) => {
         ? select(sandboxElement.nodes()[0].contentDocument.body)
         : select('body');
 
-    // Parse the graph definition
-    // parser.parse(text);
-    // log.debug('Parsed info diagram');
-    // Fetch the default direction, use TD if none was found
     const svg = root.select('#' + id);
 
     const g = svg.append('g');
@@ -45,13 +41,14 @@ export const draw = (text, id, version) => {
 
     svg.attr('height', 100);
     svg.attr('width', 400);
-    // svg.attr('viewBox', '0 0 300 150');
   } catch (e) {
     log.error('Error while rendering info diagram');
-    log.error(e.message);
+    if (e instanceof Error) {
+      log.error(e.message);
+    } else {
+      log.error('Unexpected error', e);
+    }
   }
 };
 
-export default {
-  draw,
-};
+export default draw;
diff --git a/packages/mermaid/src/diagrams/info/infoTypes.ts b/packages/mermaid/src/diagrams/info/infoTypes.ts
new file mode 100644
index 000000000..93146b510
--- /dev/null
+++ b/packages/mermaid/src/diagrams/info/infoTypes.ts
@@ -0,0 +1,10 @@
+import { DiagramDb } from '../../diagram-api/types.js';
+
+/**
+ * Info diagram DB.
+ */
+export interface InfoDb extends DiagramDb {
+  clear: () => void;
+  setInfo: (info: boolean) => void;
+  getInfo: () => boolean;
+}
diff --git a/packages/mermaid/src/diagrams/info/styles.js b/packages/mermaid/src/diagrams/info/styles.js
deleted file mode 100644
index 0b0729813..000000000
--- a/packages/mermaid/src/diagrams/info/styles.js
+++ /dev/null
@@ -1,3 +0,0 @@
-const getStyles = () => ``;
-
-export default getStyles;
diff --git a/packages/mermaid/src/styles.spec.ts b/packages/mermaid/src/styles.spec.ts
index f827c611b..51951f190 100644
--- a/packages/mermaid/src/styles.spec.ts
+++ b/packages/mermaid/src/styles.spec.ts
@@ -22,7 +22,6 @@ import er from './diagrams/er/styles.js';
 import error from './diagrams/error/styles.js';
 import git from './diagrams/git/styles.js';
 import gantt from './diagrams/gantt/styles.js';
-import info from './diagrams/info/styles.js';
 import pie from './diagrams/pie/styles.js';
 import requirement from './diagrams/requirement/styles.js';
 import sequence from './diagrams/sequence/styles.js';
@@ -92,7 +91,6 @@ describe('styles', () => {
         flowchartElk,
         gantt,
         git,
-        info,
         journey,
         mindmap,
         pie,