nemcss 0.1.2

package/README.md

@@ -0,0 +1,45 @@
+# nemcss
+
+> A design-token-driven CSS utility generator
+
+```sh
+# global
+npm install -g nemcss
+
+# local (per project)
+npm install -D nemcss
+```
+
+When installed locally, run commands via `npx nemcss <command>` or add them as scripts in your `package.json`.
+
+`nemcss` reads your design tokens and a `nemcss.config.json` file, then generates CSS custom properties and utility classes. Add `@nemcss base;` to your CSS input file. `nemcss` replaces it at build time with the generated output.
+
+## CLI commands
+
+| Command                               | Description                                                                    |
+| ------------------------------------- | ------------------------------------------------------------------------------ |
+| `nemcss init`                         | Scaffold `nemcss.config.json` and example token files in the current directory |
+| `nemcss build -i <input> -o <output>` | One-shot build: scan content files and write CSS                               |
+| `nemcss watch -i <input> -o <output>` | Watch mode: rebuild on token, content, or config changes                       |
+
+## Configuration
+
+A minimal `nemcss.config.json`:
+
+```json
+{
+  "content": ["src/**/*.html", "src/**/*.tsx"],
+  "tokensDir": "design-tokens",
+  "theme": {
+    "colors": {
+      "source": "design-tokens/colors.json",
+      "utilities": [
+        { "prefix": "text", "property": "color" },
+        { "prefix": "bg", "property": "background-color" }
+      ]
+    }
+  }
+}
+```
+
+For the full configuration reference, see the [root README](../../README.md).

package/bin/nemcss.js

@@ -0,0 +1,44 @@
+#!/usr/bin/env node
+
+const { spawnSync } = require("child_process");
+
+const PLATFORMS = {
+  "darwin-arm64": "@nemcss/cli-darwin-arm64",
+  "darwin-x64": "@nemcss/cli-darwin-x64",
+  "linux-x64": "@nemcss/cli-linux-x64",
+  "linux-arm64": "@nemcss/cli-linux-arm64",
+  "win32-x64": "@nemcss/cli-win32-x64",
+};
+
+const key = `${process.platform}-${process.arch}`;
+const pkg = PLATFORMS[key];
+
+if (!pkg) {
+  console.error(`nemcss: unsupported platform: ${key}`);
+  process.exit(1);
+}
+
+let binPath;
+try {
+  binPath = require.resolve(
+    `${pkg}/bin/nemcss${process.platform === "win32" ? ".exe" : ""}`,
+  );
+} catch {
+  console.error(
+    `nemcss: platform package ${pkg} is not installed. Try reinstalling nemcss.`,
+  );
+  process.exit(1);
+}
+
+const result = spawnSync(binPath, process.argv.slice(2), { stdio: "inherit" });
+
+if (result.error) {
+  console.error(`nemcss: failed to run binary: ${result.error.message}`);
+  process.exit(1);
+}
+
+if (result.signal) {
+  process.kill(process.pid, result.signal);
+}
+
+process.exit(result.status ?? 1);

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "nemcss",
+  "version": "0.1.2",
+  "description": "Command-line interface for nemcss, a design-token-driven CSS utility generator",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/liv7c/nemcss.git",
+    "directory": "packages/nemcss"
+  },
+  "author": "Olivia Coumans",
+  "bin": {
+    "nemcss": "./bin/nemcss.js"
+  },
+  "bugs": {
+    "url": "https://github.com/liv7c/nemcss/issues"
+  },
+  "keywords": [
+    "command-line",
+    "css generator"
+  ],
+  "engines": {
+    "node": ">=18"
+  },
+  "files": [
+    "bin",
+    "schemas"
+  ],
+  "optionalDependencies": {
+    "@nemcss/cli-darwin-arm64": "0.1.2",
+    "@nemcss/cli-darwin-x64": "0.1.2",
+    "@nemcss/cli-linux-x64": "0.1.2",
+    "@nemcss/cli-linux-arm64": "0.1.2",
+    "@nemcss/cli-win32-x64": "0.1.2"
+  }
+}

package/schemas/nemcss.config.schema.json

@@ -0,0 +1,138 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "title": "NemCSS Configuration",
+  "description": "Configuration file for the NemCSS utility CSS generator",
+  "type": "object",
+  "properties": {
+    "content": {
+      "type": "array",
+      "items": { "type": "string" },
+      "description": "Glob patterns for content files to scan for used classes",
+      "examples": [["src/**/*.html", "src/**/*.tsx"]]
+    },
+    "tokensDir": {
+      "type": "string",
+      "default": "design-tokens",
+      "description": "Directory containing design token JSON files"
+    },
+    "theme": {
+      "type": "object",
+      "description": "Primitive design token sources. Each key is a token group name.",
+      "defaultSnippets": [
+        {
+          "label": "Token group",
+          "description": "Add a token group, e.g colors or spacings",
+          "body": {
+            "${1:groupName}": {
+              "source": "${2:design-tokens/tokens.json}",
+              "prefix": "${3:prefix}"
+            }
+          }
+        }
+      ],
+      "additionalProperties": {
+        "type": "object",
+        "required": ["source"],
+        "defaultSnippets": [
+          {
+            "label": "Token group config",
+            "body": {
+              "source": "${1:design-tokens/tokens.json}",
+              "prefix": "${2:prefix}"
+            }
+          }
+        ],
+        "properties": {
+          "source": {
+            "type": "string",
+            "description": "Path to the token JSON file, relative to nemcss.config.json"
+          },
+          "prefix": {
+            "type": "string",
+            "description": "CSS custom property prefix for this token group"
+          },
+          "utilities": {
+            "type": "array",
+            "description": "Utility classes to generate for every token in this group",
+            "items": {
+              "type": "object",
+              "required": ["prefix", "property"],
+              "defaultSnippets": [
+                {
+                  "label": "Utility",
+                  "body": {
+                    "prefix": "${1:p}",
+                    "property": "${2:padding}"
+                  }
+                }
+              ],
+              "properties": {
+                "prefix": {
+                  "type": "string",
+                  "description": "CSS class prefix for this utility",
+                  "minLength": 1
+                },
+                "property": {
+                  "type": "string",
+                  "description": "CSS property to set",
+                  "minLength": 1
+                }
+              },
+              "additionalProperties": false
+            }
+          }
+        },
+        "additionalProperties": false
+      }
+    },
+    "semantic": {
+      "type": "object",
+      "description": "Semantic token groups. Each key becomes both a CSS custom property prefix and a utility class prefix.",
+      "defaultSnippets": [
+        {
+          "label": "Semantic group",
+          "description": "Add a semantic group, e.g text, bg or border",
+          "body": {
+            "${1:groupName}": {
+              "property": "${2:color}",
+              "tokens": {
+                "${3:tokenName}": "{${4:colors}.${5:variant}}"
+              }
+            }
+          }
+        }
+      ],
+      "additionalProperties": {
+        "type": "object",
+        "required": ["property", "tokens"],
+        "defaultSnippets": [
+          {
+            "label": "Semantic group config",
+            "body": {
+              "property": "${1:color}",
+              "tokens": {
+                "${2:tokenName}": "{${3:colors}.${4:variant}}"
+              }
+            }
+          }
+        ],
+        "properties": {
+          "property": {
+            "type": "string",
+            "description": "CSS property for this utility group",
+            "minLength": 1
+          },
+          "tokens": {
+            "type": "object",
+            "description": "Semantic name to primitive token reference. Each entry generates a CSS custom property and a utility class.",
+            "additionalProperties": {
+              "type": "string",
+              "pattern": "^\\{[^.{}]+\\.[^.{}]+\\}$"
+            }
+          }
+        },
+        "additionalProperties": false
+      }
+    }
+  }
+}