11 files changed, 35 insertions, 33 deletions
diff --git a/packages/ui/package.json b/packages/ui/package.json
index c2c95a0..54f5c8f 100644
--- a/packages/ui/package.json
+++ b/packages/ui/package.json
@@ -4,16 +4,17 @@
 	"exports": {
 		".": "./src/index.ts",
 		"./src/forms": "./src/forms/index.ts",
-		"./postcss": "./style/postcss.config.js",
-		"./tailwind": "./style/tailwind.js",
-		"./style": "./style/index.js",
+		"./postcss": "./style/postcss",
+		"./tailwind": "./style/tailwind",
+		"./style": "./style",
 		"./style/style.scss": "./style/style.scss",
 		"./package.json": "./package.json"
 	},
 	"main": "src/index.ts",
 	"types": "src/index.ts",
 	"scripts": {
-		"typecheck": "tsc -b"
+		"typecheck": "tsc -b",
+		"test": "vitest"
 	},
 	"dependencies": {
 		"@headlessui/react": "^1.7.17",
@@ -45,6 +46,7 @@
 		"sass": "^1.69.5",
 		"tailwindcss": "^3.3.5",
 		"tailwindcss-animate": "^1.0.7",
-		"typescript": "^5.3.2"
+		"typescript": "^5.3.2",
+		"vitest": "^0.34.6"
 	}
 }
diff --git a/packages/ui/postcss.config.js b/packages/ui/postcss.config.js
deleted file mode 100644
index cc95735..0000000
--- a/packages/ui/postcss.config.js
+++ /dev/null
@@ -1,3 +0,0 @@
-module.exports = {
-	plugins: [require('tailwindcss'), require('autoprefixer')],
-};
diff --git a/packages/ui/postcss.config.ts b/packages/ui/postcss.config.ts
new file mode 100644
index 0000000..2eb70ea
--- /dev/null
+++ b/packages/ui/postcss.config.ts
@@ -0,0 +1,8 @@
+import autoprefixer from 'autoprefixer';
+import tailwindcss from 'tailwindcss';
+
+const config = {
+	plugins: [autoprefixer(), tailwindcss()],
+};
+
+export default config;
diff --git a/packages/ui/src/index.ts b/packages/ui/src/index.ts
index 904db93..98af4eb 100644
--- a/packages/ui/src/index.ts
+++ b/packages/ui/src/index.ts
@@ -1 +1,2 @@
 export { cva, cx } from 'class-variance-authority';
+export * from './utils';
diff --git a/packages/ui/style/index.js b/packages/ui/style/index.ts
index 423b033..423b033 100644
--- a/packages/ui/style/index.js
+++ b/packages/ui/style/index.ts
diff --git a/packages/ui/style/postcss.config.js b/packages/ui/style/postcss.config.js
deleted file mode 100644
index 0b6eba2..0000000
--- a/packages/ui/style/postcss.config.js
+++ /dev/null
@@ -1 +0,0 @@
-module.exports = require('../postcss.config');
diff --git a/packages/ui/style/postcss.ts b/packages/ui/style/postcss.ts
new file mode 100644
index 0000000..60d0ac7
--- /dev/null
+++ b/packages/ui/style/postcss.ts
@@ -0,0 +1 @@
+export { default } from '../postcss.config';
diff --git a/packages/ui/style/tailwind.js b/packages/ui/style/tailwind.ts
index 8ebf041..73c8fc7 100644
--- a/packages/ui/style/tailwind.js
+++ b/packages/ui/style/tailwind.ts
@@ -1,20 +1,16 @@
-const defaultTheme = require('tailwindcss/defaultTheme');
+import type { Config } from 'tailwindcss';
 
-/** @type {(varName: string) => string} */
-// eslint-disable-next-line unused-imports/no-unused-vars
-const alpha = varName => `hsla(var(${varName}), <alpha-value>)`;
-const contentExts = `{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue,stories.tsx}`;
+import forms from '@tailwindcss/forms';
+import typography from '@tailwindcss/typography';
+import headlessui from '@headlessui/tailwindcss';
+import animate from 'tailwindcss-animate';
+import radix from 'tailwindcss-radix';
 
-// TODO: make this not CJS
+export const alpha = (varName: string) => `hsla(var(${varName}), <alpha-value>)`;
+export const contentExts = `{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue,stories.tsx}`;
 
-/**
- * @param {string} app
- * @param {import('tailwindcss').Config} options
- * @returns {import('tailwindcss').Config} the tailwind config
- */
-module.exports = (app, options) => {
-	/** @type {import('tailwindcss').Config} */
-	const config = {
+export default async (app: string, options?: Config): Promise<Config> => {
+	const config: Config = {
 		content: [
 			`../../apps/${app}/src/**/*.${contentExts}`,
 			`../../packages/*/src/**/*.${contentExts}`,
@@ -28,7 +24,6 @@ module.exports = (app, options) => {
 				md: '868px',
 				lg: '1024px',
 				xl: '1280px',
-				...defaultTheme.screens,
 			},
 			fontSize: {
 				'xs': '12px',
@@ -108,18 +103,13 @@ module.exports = (app, options) => {
 				},
 			},
 		},
-		plugins: [
-			require('@tailwindcss/forms'),
-			require('tailwindcss-animate'),
-			require('@headlessui/tailwindcss'),
-			require('tailwindcss-radix')(),
-		],
+		plugins: [forms, animate, headlessui, radix],
 
 		...options,
 	};
 
 	if (app === 'website')
-		config.plugins.push(require('@tailwindcss/typography'));
+		config.plugins!.push(typography);
 
 	return config;
 };
diff --git a/packages/ui/tailwind.config.js b/packages/ui/tailwind.config.js
deleted file mode 100644
index 8c53793..0000000
--- a/packages/ui/tailwind.config.js
+++ /dev/null
@@ -1,2 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = require('./style/tailwind')('web');
diff --git a/packages/ui/tailwind.config.ts b/packages/ui/tailwind.config.ts
new file mode 100644
index 0000000..0c30ba3
--- /dev/null
+++ b/packages/ui/tailwind.config.ts
@@ -0,0 +1,3 @@
+import tailwindConfig from './style/tailwind';
+
+export default await tailwindConfig('web');
diff --git a/packages/ui/vitest.config.ts b/packages/ui/vitest.config.ts
new file mode 100644
index 0000000..3160c1a
--- /dev/null
+++ b/packages/ui/vitest.config.ts
@@ -0,0 +1,3 @@
+import vitestShared from '@polyfrost/config/vitest.shared';
+
+export default vitestShared;