@nooeh/cli 0.1.0 → 0.2.0

package/dist/add.js

@@ -1,7 +1,7 @@
 import { mkdir, readFile, writeFile } from "node:fs/promises";
 import { dirname, isAbsolute, join, relative, resolve, sep } from "node:path";
 import { createInterface } from "node:readline/promises";
-import { defaultConfig, hasConfig, readConfig, resolveAliasPath, resolveTokensPath, } from "./config.js";
+import { defaultConfig, hasConfig, readConfig, resolveConfigPath } from "./config.js";
 import { installDependencies } from "./dependencies.js";
 import { init } from "./init.js";
 import { resolveComponent } from "./registry.js";
@@ -70,8 +70,8 @@ export async function add(projectDirectory, componentName, options = {}) {
     }
     const config = options["dry-run"] && shouldInitialize ? defaultConfig : await readConfig(projectDirectory);
     const resolved = await resolveComponent(componentName);
-    const uiDirectory = await resolveAliasPath(projectDirectory, config.aliases.ui);
-    const tokenDirectory = resolveTokensPath(projectDirectory, config.tokens);
+    const uiDirectory = resolveConfigPath(projectDirectory, config.paths.ui, "paths.ui");
+    const tokenDirectory = resolveConfigPath(projectDirectory, config.paths.tokens, "paths.tokens");
     let isOverwriteConfirmed = false;
     async function confirmOverwrite() {
         if (isOverwriteConfirmed)
@@ -101,5 +101,6 @@ export async function add(projectDirectory, componentName, options = {}) {
         return;
     }
     console.log(`Added ${componentName}.`);
-    console.log(`import { ${primaryExport} } from "${config.aliases.ui}/${componentName}"`);
+    console.log(`Export: ${primaryExport}`);
+    console.log(`Location: ${relative(projectDirectory, join(uiDirectory, `${componentName}.tsx`))}`);
 }

package/dist/arguments.d.ts

@@ -6,7 +6,7 @@ export type CliOptions = Record<string, boolean | string | undefined> & {
     force?: boolean;
     "skip-dependencies"?: boolean;
     tokens?: string;
-    "ui-alias"?: string;
+    ui?: string;
 };
 export declare function parseArguments(arguments_: readonly string[]): {
     command: string;

package/dist/config.d.ts

@@ -1,16 +1,13 @@
 export declare const configFileName = "nooeh.json";
-export declare const configVersion = 2;
 export type NooehConfig = {
-    aliases: {
+    paths: {
         ui: string;
+        tokens: string;
     };
-    tokens: string;
-    version?: number;
 };
 export declare const defaultConfig: NooehConfig;
 export declare function hasConfig(projectDirectory: string): Promise<boolean>;
 export declare function validateConfig(config: unknown): NooehConfig;
 export declare function readConfig(projectDirectory: string): Promise<NooehConfig>;
 export declare function writeConfig(projectDirectory: string, config: NooehConfig): Promise<string>;
-export declare function resolveTokensPath(projectDirectory: string, tokens: string): string;
-export declare function resolveAliasPath(projectDirectory: string, alias: string): Promise<string>;
+export declare function resolveConfigPath(projectDirectory: string, path: string, name: string): string;

package/dist/config.js

@@ -1,11 +1,11 @@
 import { access, readFile, writeFile } from "node:fs/promises";
 import { isAbsolute, relative, resolve } from "node:path";
 export const configFileName = "nooeh.json";
-export const configVersion = 2;
 export const defaultConfig = {
-    aliases: { ui: "@/components/ui" },
-    tokens: "src/styles/nooeh",
-    version: configVersion,
+    paths: {
+        ui: "src/components/ui",
+        tokens: "src/design/nooeh",
+    },
 };
 export async function hasConfig(projectDirectory) {
     try {
@@ -25,22 +25,23 @@ function ensureRelativePath(projectDirectory, path, name) {
 }
 export function validateConfig(config) {
     const candidate = config;
-    if (!candidate.aliases || typeof candidate.aliases.ui !== "string" || !candidate.aliases.ui) {
-        throw new Error("Configure aliases.ui.");
+    if (!candidate.paths && (candidate.aliases || candidate.tokens)) {
+        throw new Error("This nooeh.json uses an older format. Run `nooeh init --force` to create path-based configuration.");
     }
-    if (candidate.version !== undefined && candidate.version !== configVersion) {
-        throw new Error(`Unsupported nooeh.json version: ${String(candidate.version)}`);
+    if (!candidate.paths || typeof candidate.paths.ui !== "string" || !candidate.paths.ui.trim()) {
+        throw new Error("Configure paths.ui.");
     }
-    if (typeof candidate.tokens !== "string" || !candidate.tokens.trim()) {
-        throw new Error("Configure tokens.");
+    if (typeof candidate.paths.tokens !== "string" || !candidate.paths.tokens.trim()) {
+        throw new Error("Configure paths.tokens.");
     }
-    if (isAbsolute(candidate.tokens)) {
-        throw new Error("tokens must be inside the project directory.");
+    if (isAbsolute(candidate.paths.ui) || isAbsolute(candidate.paths.tokens)) {
+        throw new Error("paths must stay inside the project directory.");
     }
     return {
-        aliases: { ui: candidate.aliases.ui },
-        tokens: candidate.tokens,
-        version: configVersion,
+        paths: {
+            ui: candidate.paths.ui,
+            tokens: candidate.paths.tokens,
+        },
     };
 }
 function isNotFoundError(error) {
@@ -61,54 +62,13 @@ export async function readConfig(projectDirectory) {
 }
 export async function writeConfig(projectDirectory, config) {
     const validatedConfig = validateConfig(config);
-    ensureRelativePath(projectDirectory, validatedConfig.tokens, "tokens");
+    ensureRelativePath(projectDirectory, validatedConfig.paths.ui, "paths.ui");
+    ensureRelativePath(projectDirectory, validatedConfig.paths.tokens, "paths.tokens");
     const configPath = resolve(projectDirectory, configFileName);
     await writeFile(configPath, `${JSON.stringify(validatedConfig, null, 2)}\n`, "utf8");
     return configPath;
 }
-export function resolveTokensPath(projectDirectory, tokens) {
-    ensureRelativePath(projectDirectory, tokens, "tokens");
-    return resolve(projectDirectory, tokens);
-}
-function findAliasTarget(alias, paths) {
-    for (const [pattern, targets] of Object.entries(paths ?? {})) {
-        const target = targets[0];
-        if (!target)
-            continue;
-        const starIndex = pattern.indexOf("*");
-        if (starIndex === -1) {
-            if (alias === pattern)
-                return target;
-            continue;
-        }
-        const prefix = pattern.slice(0, starIndex);
-        const suffix = pattern.slice(starIndex + 1);
-        if (!alias.startsWith(prefix) || !alias.endsWith(suffix))
-            continue;
-        const value = alias.slice(prefix.length, alias.length - suffix.length);
-        return target.replaceAll("*", value);
-    }
-    return undefined;
-}
-export async function resolveAliasPath(projectDirectory, alias) {
-    for (const fileName of ["tsconfig.json", "jsconfig.json"]) {
-        const configPath = resolve(projectDirectory, fileName);
-        try {
-            const projectConfig = JSON.parse(await readFile(configPath, "utf8"));
-            const compilerOptions = projectConfig.compilerOptions ?? {};
-            const aliasTarget = findAliasTarget(alias, compilerOptions.paths);
-            if (!aliasTarget)
-                continue;
-            const baseDirectory = resolve(projectDirectory, compilerOptions.baseUrl ?? ".");
-            const resolvedPath = resolve(baseDirectory, aliasTarget);
-            ensureRelativePath(projectDirectory, resolvedPath, "UI");
-            return resolvedPath;
-        }
-        catch (error) {
-            if (isNotFoundError(error))
-                continue;
-            throw error;
-        }
-    }
-    throw new Error(`Could not find the ${alias} alias in compilerOptions.paths of tsconfig.json or jsconfig.json.`);
+export function resolveConfigPath(projectDirectory, path, name) {
+    ensureRelativePath(projectDirectory, path, name);
+    return resolve(projectDirectory, path);
 }

package/dist/doctor.js

@@ -1,6 +1,6 @@
 import { access, readFile } from "node:fs/promises";
 import { resolve } from "node:path";
-import { hasConfig, readConfig, resolveAliasPath, resolveTokensPath } from "./config.js";
+import { hasConfig, readConfig, resolveConfigPath } from "./config.js";
 async function readPackageJson(projectDirectory) {
     try {
         return JSON.parse(await readFile(resolve(projectDirectory, "package.json"), "utf8"));
@@ -73,13 +73,13 @@ export async function doctor(projectDirectory) {
     }
     else {
         const config = await readConfig(projectDirectory);
-        const uiDirectory = await resolveAliasPath(projectDirectory, config.aliases.ui);
+        const uiDirectory = resolveConfigPath(projectDirectory, config.paths.ui, "paths.ui");
         checks.push({
-            detail: `${config.aliases.ui} → ${uiDirectory}`,
-            name: "UI alias",
+            detail: `${config.paths.ui} → ${uiDirectory}`,
+            name: "UI path",
             status: "pass",
         });
-        const tokenDirectory = resolveTokensPath(projectDirectory, config.tokens);
+        const tokenDirectory = resolveConfigPath(projectDirectory, config.paths.tokens, "paths.tokens");
         const tokenFiles = [
             "color-palette.stylex.ts",
             "tokens.stylex.ts",
@@ -97,12 +97,12 @@ export async function doctor(projectDirectory) {
         }));
         checks.push(hasTokenFiles.every(Boolean)
             ? {
-                detail: `${config.tokens} contains local token sources.`,
+                detail: `${config.paths.tokens} contains local token sources.`,
                 name: "Local tokens",
                 status: "pass",
             }
             : {
-                detail: `Create local token sources in ${config.tokens} with \`nooeh init --force\`.`,
+                detail: `Create local token sources in ${config.paths.tokens} with \`nooeh init --force\`.`,
                 name: "Local tokens",
                 status: "warn",
             });
@@ -125,14 +125,14 @@ export async function doctor(projectDirectory) {
             name: "StyleX compiler",
             status: "warn",
         });
-    checks.push(entrySources.some((source) => source.includes("./styles/nooeh.css") || source.includes("@nooeh/ui/global.css"))
+    checks.push(entrySources.some((source) => source.includes("nooeh.css") || source.includes("@nooeh/ui/global.css"))
         ? {
             detail: "An application entry imports nooeh global CSS.",
             name: "Global CSS",
             status: "pass",
         }
         : {
-            detail: "Import `src/styles/nooeh.css` from an application entry point.",
+            detail: "Import the generated nooeh.css file from an application entry point.",
             name: "Global CSS",
             status: "warn",
         });

package/dist/index.js

@@ -31,7 +31,7 @@ export async function run(arguments_ = process.argv.slice(2)) {
             console.log(`Nooeh CLI
 
 Usage:
-  nooeh init
+  nooeh init [--ui <path>] [--tokens <path>]
   nooeh init --framework vite
   nooeh add <component> [--skip-dependencies] [--dry-run]
   nooeh doctor

package/dist/init.js

@@ -1,7 +1,7 @@
 import { access, mkdir, readFile, writeFile } from "node:fs/promises";
 import { dirname, join, relative, sep } from "node:path";
 import { createInterface } from "node:readline/promises";
-import { configFileName, defaultConfig, hasConfig, resolveTokensPath, writeConfig, } from "./config.js";
+import { configFileName, defaultConfig, hasConfig, resolveConfigPath, writeConfig, } from "./config.js";
 import { installDependencies } from "./dependencies.js";
 import { getTokenFiles } from "@nooeh/registry";
 async function ask(question, defaultValue, readline) {
@@ -61,7 +61,7 @@ async function writeViteFiles(projectDirectory, tokenDirectory) {
     const configuredVite = configureVite(configSource);
     const { entryPath, stylePath, themePath } = getNooehPaths(projectDirectory, tokenDirectory);
     const entrySource = await readFile(entryPath, "utf8");
-    const styleImport = 'import "./styles/nooeh.css";';
+    const styleImport = `import "${toModuleSpecifier(dirname(entryPath), stylePath)}";`;
     const themeImport = `import { applyNooehTheme } from "${toModuleSpecifier(dirname(entryPath), themePath)}";`;
     const themeApply = "applyNooehTheme();";
     const imports = [styleImport, themeImport].filter((line) => !entrySource.includes(line));
@@ -77,7 +77,7 @@ function getNooehPaths(projectDirectory, tokenDirectory) {
     const sourceDirectory = getSourceDirectory(projectDirectory);
     return {
         entryPath: join(sourceDirectory, "main.tsx"),
-        stylePath: join(sourceDirectory, "styles", "nooeh.css"),
+        stylePath: join(dirname(tokenDirectory), "nooeh.css"),
         themePath: join(tokenDirectory, "theme.ts"),
     };
 }
@@ -112,15 +112,16 @@ export async function init(projectDirectory, options) {
         if (options.framework && options.framework !== "vite") {
             throw new Error(`Unsupported framework: ${options.framework}. Use vite or omit --framework.`);
         }
-        const uiAlias = options["ui-alias"] ??
+        const uiPath = options.ui ??
             (readline
-                ? await ask("Enter the UI alias.", defaultConfig.aliases.ui, readline)
-                : defaultConfig.aliases.ui);
+                ? await ask("Enter the UI directory.", defaultConfig.paths.ui, readline)
+                : defaultConfig.paths.ui);
         const tokens = options.tokens ??
             (readline
-                ? await ask("Enter the token directory.", defaultConfig.tokens, readline)
-                : defaultConfig.tokens);
-        const tokenDirectory = resolveTokensPath(projectDirectory, tokens);
+                ? await ask("Enter the token directory.", defaultConfig.paths.tokens, readline)
+                : defaultConfig.paths.tokens);
+        const tokenDirectory = resolveConfigPath(projectDirectory, tokens, "paths.tokens");
+        resolveConfigPath(projectDirectory, uiPath, "paths.ui");
         if (!options["skip-dependencies"]) {
             await installDependencies(projectDirectory, ["@stylexjs/stylex"]);
             await installDependencies(projectDirectory, ["@stylexjs/unplugin"], true);
@@ -133,7 +134,7 @@ export async function init(projectDirectory, options) {
             console.log(`Created ${relative(projectDirectory, stylePath)} and ${relative(projectDirectory, themePath)}.`);
             console.log("Import the CSS and call applyNooehTheme() from your application entry point.");
         }
-        await writeConfig(projectDirectory, { aliases: { ui: uiAlias }, tokens });
+        await writeConfig(projectDirectory, { paths: { ui: uiPath, tokens } });
     }
     finally {
         readline?.close();

package/dist/new-component.js

@@ -1,6 +1,6 @@
 import { access, mkdir, writeFile } from "node:fs/promises";
 import { dirname, join, relative, sep } from "node:path";
-import { readConfig, resolveAliasPath, resolveTokensPath } from "./config.js";
+import { readConfig, resolveConfigPath } from "./config.js";
 function toPascalCase(name) {
     return name
         .split("-")
@@ -13,10 +13,10 @@ export async function newComponent(projectDirectory, name) {
         throw new Error("Enter a component name in kebab-case. For example: status-chip.");
     }
     const config = await readConfig(projectDirectory);
-    const uiDirectory = await resolveAliasPath(projectDirectory, config.aliases.ui);
+    const uiDirectory = resolveConfigPath(projectDirectory, config.paths.ui, "paths.ui");
     const componentName = toPascalCase(name);
     const componentPath = join(uiDirectory, `${name}.tsx`);
-    const tokenPath = join(resolveTokensPath(projectDirectory, config.tokens), "tokens.stylex.ts");
+    const tokenPath = join(resolveConfigPath(projectDirectory, config.paths.tokens, "paths.tokens"), "tokens.stylex.ts");
     const relativeTokenPath = relative(dirname(componentPath), tokenPath)
         .replace(/\.ts$/, "")
         .split(sep)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nooeh/cli",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "private": false,
   "bin": {
     "nooeh": "./dist/cli.js"