feat: Skeleton Plugin refactor (#1660)

packages/plugin/scripts/convert-theme.ts

@@ -0,0 +1,35 @@
+import { readFileSync } from 'fs';
+import { writeFile } from 'fs/promises';
+import postcss from 'postcss';
+import postcssJs from 'postcss-js';
+import type { Theme } from '../src/tailwind/themes';
+
+// Converts a theme's .css file into a .ts file.
+export async function convertTheme(name: string) {
+	const cssEntryPath = `./src/themes/theme-${name}.css`;
+	const css = readFileSync(cssEntryPath, 'utf8');
+	const result = postcss().process(css, { from: cssEntryPath });
+
+	const cssInJs = postcssJs.objectify(result.root);
+
+	const properties = { ...cssInJs[':root'] };
+
+	delete cssInJs[':root'];
+
+	const theme = {
+		properties: properties,
+		enhancements: { ...cssInJs }
+	} satisfies Theme;
+
+	// Creates the generated CSS-in-JS file
+	await writeFile(
+		`./src/tailwind/themes/${name}.ts`,
+		`import type { Theme } from './index.js';
+
+const ${name} = ${JSON.stringify(theme, undefined, '\t')} satisfies Theme;
+	
+export default ${name};`
+	).catch((e) => console.error(e));
+}
+
+convertTheme('vintage');