@postenbring/hedwig-css 0.0.5 → 0.0.6

package/package.json

@@ -1,11 +1,10 @@
 {
   "name": "@postenbring/hedwig-css",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "",
   "files": [
     "dist/**",
-    "typed-classname.mjs",
-    "typed-classname.d.mts"
+    "typed-classname/**"
   ],
   "license": "MIT",
   "devDependencies": {

package/typed-classname/build.mjs

@@ -0,0 +1,44 @@
+// @ts-check
+import { readFile, writeFile } from "node:fs/promises";
+import { transform } from "lightningcss";
+
+// Read the input file
+const file = await readFile(new URL("../dist/index.css", import.meta.url), "utf8");
+
+/** @type {Set<string>} */
+const allClasses = new Set([]);
+
+transform({
+  filename: "",
+  code: Buffer.from(file),
+  visitor: {
+    Selector(_selector) {
+      inner(_selector);
+
+      /** @typedef {import('lightningcss').Selector} Selector */
+      /** @param {Selector} selector */
+      function inner(selector) {
+        for (const selectorComponent of selector) {
+          if (selectorComponent.type === "class") {
+            allClasses.add(selectorComponent.name);
+          }
+
+          // Extract classnames from pseudo selectors
+          if ("selectors" in selectorComponent && selectorComponent.selectors) {
+            const childSelectors = [selectorComponent.selectors].flat(2);
+            inner(childSelectors);
+          }
+        }
+      }
+    },
+  },
+});
+
+// Output the result
+const output = `// Autogenerated file, do not edit
+
+export type ClassNames =
+  | ${[...allClasses].map((className) => `"${className}"`).join("\n  | ")};
+`;
+
+await writeFile(new URL("../dist/classnames.d.ts", import.meta.url), output);

package/typed-classname/index.d.mts

@@ -0,0 +1,14 @@
+import { ClassNames } from "../dist/classnames";
+
+/**
+ * Helper function to ensure classnames are referenced correctly
+ *
+ * ```tsx
+ * <button className="hds-button"> ✅ Passes
+ * <button className="hds-buton">  ❌ Fails typecheck
+ * ```
+ *
+ * @param {ClassNames} value
+ * @returns {ClassNames}
+ */
+export function t(value: ClassNames): ClassNames;

package/typed-classname/index.mjs

@@ -0,0 +1,11 @@
+// @ts-check
+/**
+ * @typedef {import('../dist/classnames').ClassNames} ClassNames
+ */
+
+/**
+ * Helper function to get ensure classnames are referenced correctly
+ */
+export function t(value) {
+  return value;
+}