8 files changed, 101 insertions, 27 deletions

diff --git a/package-lock.json b/package-lock.json
index f7cf39f7b..90aaac84a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5646,17 +5646,32 @@
     "@meetfranz/theme": {
       "version": "file:packages/theme",
       "requires": {
-        "color": "3.1.2"
+        "color": "4.0.1"
       },
       "dependencies": {
         "color": {
-          "version": "3.1.2",
-          "resolved": "https://registry.npmjs.org/color/-/color-3.1.2.tgz",
-          "integrity": "sha512-vXTJhHebByxZn3lDvDJYw4lR5+uB3vuoHsuYA5AKuxRVn5wzzIfQKGLBmgdVRHKTJYeK5rvJcHnrd0Li49CFpg==",
+          "version": "4.0.1",
+          "resolved": "https://registry.npmjs.org/color/-/color-4.0.1.tgz",
+          "integrity": "sha512-rpZjOKN5O7naJxkH2Rx1sZzzBgaiWECc6BYXjeCE6kF0kcASJYbUq02u7JqIHwCb/j3NhV+QhRL2683aICeGZA==",
           "requires": {
-            "color-convert": "^1.9.1",
-            "color-string": "^1.5.2"
+            "color-convert": "^2.0.1",
+            "color-string": "^1.6.0"
+          },
+          "dependencies": {
+            "color-convert": {
+              "version": "2.0.1",
+              "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+              "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+              "requires": {
+                "color-name": "~1.1.4"
+              }
+            }
           }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
         }
       }
     },
@@ -6457,6 +6472,12 @@
       "integrity": "sha512-vwNP+pzkI1ipznek2fCA4xj1kQyL9EJcfdBezD9eToe9eP2IgT3WLEBrVqiXal34LOyiAs8xCQKwugEYOKcMkw==",
       "dev": true
     },
+    "@types/expect.js": {
+      "version": "0.3.29",
+      "resolved": "https://registry.npmjs.org/@types/expect.js/-/expect.js-0.3.29.tgz",
+      "integrity": "sha1-KN01kVW4S47LCUr8P0t0wyItyjs=",
+      "dev": true
+    },
     "@types/fs-extra": {
       "version": "9.0.12",
       "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-9.0.12.tgz",
@@ -6554,6 +6575,12 @@
         "@types/node": "*"
       }
     },
+    "@types/mocha": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-9.0.0.tgz",
+      "integrity": "sha512-scN0hAWyLVAvLR9AyW7HoFF5sJZglyBsbPuHO4fv7JRvfmPBMfp1ozWqOf/e4wwPNxezBZXRfWzMb6iFLgEVRA==",
+      "dev": true
+    },
     "@types/ms": {
       "version": "0.7.31",
       "resolved": "https://registry.npmjs.org/@types/ms/-/ms-0.7.31.tgz",
@@ -27964,6 +27991,40 @@
         }
       }
     },
+    "ts-mocha": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/ts-mocha/-/ts-mocha-8.0.0.tgz",
+      "integrity": "sha512-Kou1yxTlubLnD5C3unlCVO7nh0HERTezjoVhVw/M5S1SqoUec0WgllQvPk3vzPMc6by8m6xD1uR1yRf8lnVUbA==",
+      "dev": true,
+      "requires": {
+        "ts-node": "7.0.1",
+        "tsconfig-paths": "^3.5.0"
+      }
+    },
+    "ts-node": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-7.0.1.tgz",
+      "integrity": "sha512-BVwVbPJRspzNh2yfslyT1PSbl5uIk03EZlb493RKHN4qej/D06n1cEhjlOJG69oFsE7OT8XjpTUcYf6pKTLMhw==",
+      "dev": true,
+      "requires": {
+        "arrify": "^1.0.0",
+        "buffer-from": "^1.1.0",
+        "diff": "^3.1.0",
+        "make-error": "^1.1.1",
+        "minimist": "^1.2.0",
+        "mkdirp": "^0.5.1",
+        "source-map-support": "^0.5.6",
+        "yn": "^2.0.0"
+      },
+      "dependencies": {
+        "diff": {
+          "version": "3.5.0",
+          "resolved": "https://registry.npmjs.org/diff/-/diff-3.5.0.tgz",
+          "integrity": "sha512-A46qtFgd+g7pDZinpnwiRJtxbC1hpgf0uzP3iG89scHk0AUC7A1TGxf5OiiOUv/JMZR8GOt8hL900hV0bOy5xA==",
+          "dev": true
+        }
+      }
+    },
     "tsconfig-paths": {
       "version": "3.11.0",
       "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.11.0.tgz",
@@ -30251,6 +30312,12 @@
         "fd-slicer": "~1.1.0"
       }
     },
+    "yn": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/yn/-/yn-2.0.0.tgz",
+      "integrity": "sha1-5a2ryKz0CPY4X8dklWhMiOavaJo=",
+      "dev": true
+    },
     "yocto-queue": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",
diff --git a/package.json b/package.json
index b1cde30db..74c0f7747 100644
--- a/package.json
+++ b/package.json
@@ -149,8 +149,11 @@
     "@tsconfig/node14": "1.0.1",
     "@types/color": "3.0.2",
     "@types/du": "1.0.1",
+    "@types/expect.js": "0.3.29",
     "@types/fs-extra": "9.0.12",
     "@types/lodash": "4.14.172",
+    "@types/mocha": "9.0.0",
+    "@types/ms": "0.7.31",
     "@types/node": "14.17.6",
     "@types/react": "16.14.6",
     "@types/react-dom": "16.9.13",
@@ -207,6 +210,7 @@
     "simple-git": "2.45.0",
     "terser": "4.8.0",
     "ts-loader": "5.4.5",
+    "ts-mocha": "8.0.0",
     "typescript": "3.9.10",
     "wait-on": "6.0.0",
     "webpack": "4.46.0",
diff --git a/packages/theme/package.json b/packages/theme/package.json
index 516bab93c..7f3226bd8 100644
--- a/packages/theme/package.json
+++ b/packages/theme/package.json
@@ -17,13 +17,13 @@
     "dev": "tsc -w",
     "build": "tsc",
     "preprepare": "npm run test",
-    "test": "npx mocha"
+    "test": "ts-mocha 'test/**/*.test.ts'"
   },
   "bugs": {
     "url": "https://github.com/meetfranz/franz/issues"
   },
   "dependencies": {
-    "color": "3.1.2"
+    "color": "4.0.1"
   },
   "gitHead": "9f2ab40b7602bc3df26ebb093b484b9917768f69"
 }
diff --git a/packages/theme/src/themes/IStyleTypes.ts b/packages/theme/src/themes/IStyleTypes.ts
index cf8bdea33..48f52daf2 100644
--- a/packages/theme/src/themes/IStyleTypes.ts
+++ b/packages/theme/src/themes/IStyleTypes.ts
@@ -1,4 +1,4 @@
-export default interface IStyleTypes {
+export interface IStyleTypes {
   [index: string]: {
     accent: string;
     contrast: string;
diff --git a/packages/theme/src/themes/default/index.ts b/packages/theme/src/themes/default/index.ts
index 7f69e22a5..80bcba766 100644
--- a/packages/theme/src/themes/default/index.ts
+++ b/packages/theme/src/themes/default/index.ts
@@ -2,7 +2,7 @@ import color from 'color';
 import { cloneDeep } from 'lodash';
 
 import * as legacyStyles from '../legacy';
-import IStyleTypes from '../IStyleTypes';
+import type { IStyleTypes } from '../IStyleTypes';
 
 export default (brandPrimary: string) => {
   const brandSuccess = '#5cb85c';
diff --git a/packages/theme/test/index.test.js b/packages/theme/test/index.test.js
deleted file mode 100644
index 3906433c1..000000000
--- a/packages/theme/test/index.test.js
+++ /dev/null
@@ -1,17 +0,0 @@
-const expect = require('expect.js');
-
-const { colorBackground: colorBackgroundDefault } = require('../lib/themes/default');
-const { colorBackground: colorBackgroundDark } = require('../lib/themes/dark');
-const { default: theme } = require('../lib');
-
-describe('Load theme', () => {
-  it('Should load default theme', () => {
-    const { colorBackground } = theme('default');
-    expect(colorBackground).to.be(colorBackgroundDefault);
-  });
-
-  it('Should load dark theme', () => {
-    const { colorBackground } = theme('dark');
-    expect(colorBackground).to.be(colorBackgroundDark);
-  });
-});
diff --git a/packages/theme/test/index.test.ts b/packages/theme/test/index.test.ts
new file mode 100644
index 000000000..7eda4e359
--- /dev/null
+++ b/packages/theme/test/index.test.ts
@@ -0,0 +1,19 @@
+import expect from 'expect.js';
+
+import makeDefaultThemeConfig from '../src/themes/default';
+import makeDarkThemeConfig from '../src/themes/dark';
+import { theme, ThemeType } from '../src';
+
+describe('Load theme', () => {
+  it('Should load default theme', () => {
+    const { colorBackground } = theme('default' as ThemeType);
+    expect(colorBackground).to.be(
+      makeDefaultThemeConfig('default').colorBackground,
+    );
+  });
+
+  it('Should load dark theme', () => {
+    const { colorBackground } = theme('dark' as ThemeType);
+    expect(colorBackground).to.be(makeDarkThemeConfig('dark').colorBackground);
+  });
+});
diff --git a/packages/theme/tsconfig.json b/packages/theme/tsconfig.json
index d80ee9ee7..4deaa5dd7 100644
--- a/packages/theme/tsconfig.json
+++ b/packages/theme/tsconfig.json
@@ -4,4 +4,5 @@
     "outDir": "lib",
     "rootDir": "src"
   },
+  "exclude": ["node_modules", "lib", "test"]
 }