[WIP] feat: add build script to auto generate types.ts

CONTRIBUTING.md

@@ -159,7 +159,7 @@ Simply run `pnpm generate component` and follow the prompts, and you'll be well
 ### Adding Icons to LaunchPad
 
 - Add the SVG body content into a new symbol entry with id `lp-icon-{name}` in the `/src/image/sprite.svg` file in the `@launchpad/icons` package.
-- Add its `id` (minus prefix `lp-icon`) to the icons array in `/src/types.ts`.
+- Run `pnpm icons:build` to add its `id` (minus prefix `lp-icon`) to the icons array in `/src/types.ts`.
 - Run `pnpm storybook` and visit the "Icons" page to ensure your icon was generated properly.
 
 ---

package.json

@@ -14,6 +14,7 @@
     "format": "prettier --write \"**/*.{ts,tsx,md}\"",
     "generate": "plop",
     "graph": "nx affected:graph",
+    "icons:build": "npx ts-node -O '{\"types\": [\"node\"], \"module\": \"nodenext\"}' ./scripts/build-icons.ts",
     "lint": "eslint '**/*.{ts,tsx,js}' --ignore-pattern '/packages/' --ignore-pattern '/apps/'",
     "lint:ci": "pnpm build:transform && pnpm lint && pnpm lint:packages",
     "lint:packages": "nx affected --target=lint",

scripts/build-icons.ts

@@ -0,0 +1,23 @@
+import fs from 'fs';
+import path from 'path';
+
+const iconsPath: string = path.join(__dirname, '../packages/icons/src/img/sprite.svg');
+const icons: string = fs.readFileSync(iconsPath, 'utf8');
+const matchResult: RegExpMatchArray | null = icons.match(/id="lp-icon-([a-z-]+)"/g);
+
+if (matchResult) {
+  const ids: string[] = matchResult.map((id: string) => id.slice(12, -1));
+  const stylizedString: string = JSON.stringify(ids, null, 2).replace(/"/g, "'").slice(0, -2) + ',';
+  const outputPath: string = path.join(__dirname, '../packages/icons/src/types.ts');
+  const output: string = `const icons = ${stylizedString}
+] as const;
+type IconName = (typeof icons)[number];
+
+export type { IconName };
+export { icons };
+`;
+
+  fs.writeFileSync(outputPath, output, 'utf8');
+} else {
+  console.log('No icon IDs found in the SVG file.');
+}