components-differ 1.2.1 → 1.2.3

package/dist/parse-file-path.js

@@ -0,0 +1,73 @@
+import path from "node:path";
+function fixAlias(alias) {
+    return alias.replace("@", ".");
+}
+export function parseFilePath(wasInSrcDir, config, filePath, content) {
+    const normalizedPath = filePath.replace(/^\.\//, "");
+    const extension = path.extname(normalizedPath);
+    const baseName = path.basename(normalizedPath);
+    const styleExtensions = new Set([
+        ".css",
+        ".scss",
+        ".sass",
+        ".less",
+        ".pcss",
+    ]);
+    const fileExtensions = new Set([
+        ".json",
+        ".yaml",
+        ".yml",
+        ".md",
+        ".mdx",
+        ".txt",
+    ]);
+    const themePattern = /(\/|^)(theme|.*-theme)(\.[a-z0-9]+)?$/i;
+    const sanitizedTargetPath = normalizedPath.replace(/^src\//, "");
+    const defaultTarget = wasInSrcDir ? filePath : `~/${normalizedPath}`;
+    const out = {
+        path: filePath,
+        content,
+        type: "registry:example",
+        target: defaultTarget,
+    };
+    if (filePath.startsWith(fixAlias(config.ui))) {
+        out.type = "registry:ui";
+        out.target = undefined;
+    }
+    else if (filePath.startsWith(fixAlias(config.components))) {
+        out.type = "registry:block";
+        out.target = undefined;
+    }
+    else if (filePath.startsWith(fixAlias(config.hooks))) {
+        out.type = "registry:hook";
+        out.target = undefined;
+    }
+    else if (filePath.startsWith(fixAlias(config.lib))) {
+        out.type = "registry:lib";
+        out.target = undefined;
+    }
+    else if (normalizedPath.startsWith("app/")) {
+        out.type = "registry:page";
+        out.target = `./${sanitizedTargetPath}`;
+    }
+    else if (themePattern.test(normalizedPath)) {
+        out.type = "registry:theme";
+        out.target = undefined;
+    }
+    else if (styleExtensions.has(extension)) {
+        out.type = "registry:style";
+    }
+    else if (baseName.startsWith(".env") || fileExtensions.has(extension)) {
+        out.type = "registry:file";
+        out.target = `~/${sanitizedTargetPath}`;
+    }
+    else if (extension === ".tsx" || extension === ".jsx") {
+        out.type = "registry:component";
+        out.target = undefined;
+    }
+    else {
+        out.type = "registry:file";
+        out.target = `./${sanitizedTargetPath}`;
+    }
+    return out;
+}

package/dist/release.js

@@ -0,0 +1,50 @@
+import { spawnSync } from "node:child_process";
+function run(command, args = []) {
+    const full = [command, ...args].join(" ");
+    console.log(`\n$ ${full}`);
+    const result = spawnSync(command, args, {
+        stdio: "inherit",
+        shell: process.platform === "win32",
+    });
+    if (result.status !== 0) {
+        console.error(`\nCommand failed: ${full}`);
+        process.exit(result.status === null ? 1 : result.status);
+    }
+}
+function getVersionBumpFromArgs() {
+    const type = process.argv[2] ?? "patch";
+    if (!["patch", "minor", "major"].includes(type)) {
+        console.error(`Invalid version bump "${type}". Use one of: patch, minor, major.`);
+        process.exit(1);
+    }
+    return type;
+}
+function ensureCleanGit() {
+    const result = spawnSync("git", ["status", "--porcelain"], {
+        encoding: "utf8",
+    });
+    if (result.status !== 0) {
+        console.error("Failed to check git status.");
+        process.exit(1);
+    }
+    if ((result.stdout ?? "").trim().length > 0) {
+        console.error("Git working tree is not clean. Commit or stash your changes before releasing.");
+        process.exit(1);
+    }
+}
+async function main() {
+    const bump = getVersionBumpFromArgs();
+    console.log("Ensuring clean git working tree...");
+    ensureCleanGit();
+    console.log("\nBuilding project...");
+    run("npm", ["run", "build"]);
+    console.log(`\nBumping version (${bump})...`);
+    run("npm", ["version", bump]);
+    console.log("\nPublishing to npm...");
+    run("npm", ["publish"]);
+    console.log("\nRelease complete.");
+}
+main().catch((err) => {
+    console.error(err);
+    process.exit(1);
+});

package/dist/resolve-imports.js

@@ -0,0 +1,103 @@
+import path from "node:path";
+import { extractPathSpecifiers } from "./extract-imports.js";
+const EXTENSIONS = [".tsx", ".ts", ".jsx", ".js", ".mts", ".mjs", ".cts", ".cjs"];
+const INDEX_NAMES = ["index.tsx", "index.ts", "index.jsx", "index.js"];
+/** Build [aliasPrefix, pathPrefix] pairs, longest first. pathPrefix is project-relative (e.g. src/lib when isSrcDir). */
+function getAliasEntries(config) {
+    const entries = [];
+    const prefix = config.isSrcDir ? "src/" : "";
+    const keys = ["components", "utils", "ui", "lib", "hooks"];
+    for (const k of keys) {
+        const v = config[k];
+        if (typeof v === "string" && v.startsWith("@/")) {
+            const pathPart = v.replace(/^@\//, "").replace(/\/$/, "");
+            entries.push([v.replace(/\/$/, ""), prefix + pathPart]);
+        }
+    }
+    entries.push(["@", config.isSrcDir ? "src" : ""]);
+    entries.sort((a, b) => b[0].length - a[0].length);
+    return entries;
+}
+/**
+ * Resolve a path-like import specifier to a project-relative file path.
+ * Tries common extensions and /index.*. Returns the first path that exists in projectPaths.
+ */
+function resolveSpecifier(specifier, fromFilePath, aliasEntries, projectPaths, rootFallback) {
+    const normalizedFrom = fromFilePath.replace(/\\/g, "/");
+    const fromDir = path.dirname(normalizedFrom).replace(/\\/g, "/");
+    let candidate;
+    if (specifier.startsWith(".") || specifier.startsWith("/")) {
+        candidate = path.normalize(path.join(fromDir, specifier)).replace(/\\/g, "/");
+    }
+    else {
+        // Alias: @/components/Button -> components/Button
+        let matched = false;
+        for (const [aliasPrefix, pathPrefix] of aliasEntries) {
+            const prefix = aliasPrefix === "@" ? "@/" : aliasPrefix.endsWith("/") ? aliasPrefix : aliasPrefix + "/";
+            if (specifier === aliasPrefix || specifier.startsWith(prefix)) {
+                const suffix = specifier.slice(prefix.length).replace(/^\//, "");
+                candidate = path.normalize(path.join(pathPrefix, suffix)).replace(/\\/g, "/");
+                matched = true;
+                break;
+            }
+        }
+        if (!matched) {
+            const suffix = specifier.replace(/^@\//, "").replace(/^~\//, "");
+            candidate = path.normalize(path.join(rootFallback, suffix)).replace(/\\/g, "/");
+        }
+    }
+    if (!candidate)
+        return null;
+    if (projectPaths.has(candidate))
+        return candidate;
+    for (const ext of EXTENSIONS) {
+        const p = candidate.endsWith(ext) ? candidate : candidate + ext;
+        if (projectPaths.has(p))
+            return p;
+    }
+    for (const name of INDEX_NAMES) {
+        const p = candidate.endsWith("/") ? candidate + name : candidate + "/" + name;
+        if (projectPaths.has(p))
+            return p;
+    }
+    return null;
+}
+/**
+ * Expand the list of included files by recursively adding any project file
+ * that is imported (via relative or alias path) by an already-included file.
+ * Uses TypeScript/JS import syntax only.
+ */
+export function expandIncludedFiles(includedFiles, allProjectFiles, config) {
+    const projectPathToFile = new Map();
+    for (const f of allProjectFiles) {
+        const key = f.path.replace(/\\/g, "/");
+        projectPathToFile.set(key, f);
+    }
+    const projectPaths = new Set(projectPathToFile.keys());
+    const aliasEntries = getAliasEntries(config);
+    const rootFallback = config.isSrcDir ? "src" : "";
+    const includedPaths = new Set();
+    for (const f of includedFiles) {
+        includedPaths.add(f.path.replace(/\\/g, "/"));
+    }
+    let added = true;
+    while (added) {
+        added = false;
+        for (const file of [...includedFiles]) {
+            const content = file.content;
+            const fromPath = file.path.replace(/\\/g, "/");
+            for (const spec of extractPathSpecifiers(content)) {
+                const resolved = resolveSpecifier(spec, fromPath, aliasEntries, projectPaths, rootFallback);
+                if (resolved && !includedPaths.has(resolved)) {
+                    const scanned = projectPathToFile.get(resolved);
+                    if (scanned) {
+                        includedFiles.push(scanned);
+                        includedPaths.add(resolved);
+                        added = true;
+                    }
+                }
+            }
+        }
+    }
+    return includedFiles;
+}

package/package.json

@@ -1,52 +1,23 @@
 {
   "name": "components-differ",
-  "version": "1.2.1",
-  "description": "Simple CLI to create Shadcn components from project",
+  "version": "1.2.3",
+  "description": "CLI to generate shadcn registry items from git diffs",
+  "license": "ISC",
   "type": "module",
-  "main": "dist/index.mjs",
-  "bin": "dist/index.mjs",
-  "exports": {
-    ".": "./dist/index.mjs"
+  "main": "dist/index.js",
+  "bin": {
+    "components-differ": "dist/index.js"
   },
-  "files": [
-    "dist"
-  ],
-  "directories": {
-    "test": "tests"
+  "scripts": {
+    "build": "tsc",
+    "release": "npm run build && node dist/release.js"
   },
   "dependencies": {
-    "commander": "^12.1.0",
-    "ignore": "^6.0.2"
+    "commander": "13.1.0",
+    "ignore": "7.0.4"
   },
   "devDependencies": {
-    "vitest": "^2.1.1"
-  },
-  "publishConfig": {
-    "access": "public"
-  },
-  "engines": {
-    "node": ">=18"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/componentshost/components-differ.git"
-  },
-  "keywords": [
-    "components",
-    "shadcn",
-    "differ",
-    "react",
-    "vite"
-  ],
-  "author": "Izet Molla",
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/componentshost/components-differ/issues"
-  },
-  "homepage": "https://github.com/componentshost/components-differ#readme",
-  "scripts": {
-    "build": "node ./scripts/build.mjs",
-    "release": "pnpm run prepublishOnly && pnpm publish --access public",
-    "test": "vitest run"
+    "typescript": "5.9.3",
+    "@types/node": "25.3.0"
   }
-}
+}

package/src/components.ts

@@ -0,0 +1,170 @@
+import path from "node:path";
+import fs from "node:fs";
+
+const WHITELISTED_COMPONENTS = [
+  "accordion",
+  "alert",
+  "alert-dialog",
+  "aspect-ratio",
+  "avatar",
+  "badge",
+  "breadcrumb",
+  "button",
+  "button-group",
+  "calendar",
+  "card",
+  "carousel",
+  "chart",
+  "checkbox",
+  "collapsible",
+  "combobox",
+  "command",
+  "context-menu",
+  "data-table",
+  "date-picker",
+  "dialog",
+  "drawer",
+  "dropdown-menu",
+  "empty",
+  "field",
+  "form",
+  "hover-card",
+  "input",
+  "input-group",
+  "input-otp",
+  "item",
+  "kbd",
+  "label",
+  "menubar",
+  "native-select",
+  "navigation-menu",
+  "pagination",
+  "popover",
+  "progress",
+  "radio-group",
+  "resizable",
+  "scroll-area",
+  "select",
+  "separator",
+  "sheet",
+  "sidebar",
+  "skeleton",
+  "slider",
+  "sonner",
+  "spinner",
+  "switch",
+  "table",
+  "tabs",
+  "textarea",
+  "toast",
+  "toggle",
+  "toggle-group",
+  "tooltip",
+  "typography",
+] as const;
+
+type WhitelistedComponent = (typeof WHITELISTED_COMPONENTS)[number];
+
+export interface ComponentsConfig {
+  components: string;
+  utils: string;
+  ui: string;
+  lib: string;
+  hooks: string;
+  registries?: Record<string, unknown>;
+  isSrcDir?: boolean;
+}
+
+function findComponentsJson(startDir: string): string | null {
+  let currentDir = startDir;
+
+  while (true) {
+    const manifestPath = path.join(currentDir, "components.json");
+    if (fs.existsSync(manifestPath)) {
+      return manifestPath;
+    }
+
+    const parentDir = path.dirname(currentDir);
+    if (parentDir === currentDir) {
+      break;
+    }
+    currentDir = parentDir;
+  }
+
+  return null;
+}
+
+export function findComponentFiles(
+  config: ComponentsConfig,
+  originalFiles: { path: string }[],
+): string[] {
+  const registryDependencies: string[] = [];
+  const compDir = config.ui.replace("@/", config.isSrcDir ? "src/" : "");
+
+  const registriesConfig = config.registries ?? {};
+  const registryNamespaces = Object.keys(registriesConfig);
+  const defaultNamespace =
+    registryNamespaces.find((name) => name === "@shadcn") ??
+    registryNamespaces[0] ??
+    null;
+
+  for (const { path: filePath } of originalFiles) {
+    if (filePath.startsWith(compDir)) {
+      const fileExtension = path.extname(filePath);
+      const fileName = path.basename(filePath, fileExtension) as WhitelistedComponent;
+      if (
+        (fileExtension === ".tsx" || fileExtension === ".jsx") &&
+        WHITELISTED_COMPONENTS.includes(fileName)
+      ) {
+        const baseName = path.basename(filePath, fileExtension);
+        const dependencyName = defaultNamespace
+          ? `${defaultNamespace}/${baseName}`
+          : baseName;
+        registryDependencies.push(dependencyName);
+      }
+    }
+  }
+
+  return registryDependencies;
+}
+
+export function readComponentsManifest(dir: string): ComponentsConfig {
+  const manifestPath = findComponentsJson(dir);
+
+  if (!manifestPath) {
+    console.error("Components manifest (components.json) not found");
+    process.exit(1);
+  }
+
+  const json = JSON.parse(fs.readFileSync(manifestPath, "utf-8")) as {
+    aliases: Omit<ComponentsConfig, "registries" | "isSrcDir">;
+    registries?: ComponentsConfig["registries"];
+  };
+
+  return {
+    ...json.aliases,
+    registries: json.registries ?? {},
+  };
+}
+
+export function getAliasedPaths(config: ComponentsConfig): string[] {
+  return [
+    config.components.replace("@/", ""),
+    config.utils.replace("@/", ""),
+    config.ui.replace("@/", ""),
+    config.lib.replace("@/", ""),
+    config.hooks.replace("@/", ""),
+  ];
+}
+
+export function isBuiltinComponent(
+  config: ComponentsConfig,
+  filePath: string,
+): boolean {
+  if (filePath.startsWith(config.ui.replace("@/", ""))) {
+    const component = path.basename(filePath, path.extname(filePath));
+    return (WHITELISTED_COMPONENTS as readonly string[]).includes(component);
+  }
+  return false;
+}
+

package/src/create-diff.ts

@@ -0,0 +1,156 @@
+import {
+  findComponentFiles,
+  getAliasedPaths,
+  isBuiltinComponent,
+  type ComponentsConfig,
+} from "./components.js";
+import { parseFilePath, type ParsedFile } from "./parse-file-path.js";
+import { extractImportedPackages } from "./extract-imports.js";
+import type { ScannedFile } from "./git.js";
+
+interface CreateDiffOptions {
+  name: string;
+  config: ComponentsConfig & { isSrcDir?: boolean };
+  alteredFiles: ScannedFile[];
+  specificFiles: Record<string, string>;
+  currentFiles: ScannedFile[];
+  currentPackageJson: string;
+}
+
+export interface RegistryDiffOutput {
+  name: string;
+  type: "registry:block";
+  dependencies: string[];
+  devDependencies: string[];
+  registryDependencies: string[];
+  files: ParsedFile[];
+  tailwind: Record<string, unknown>;
+  cssVars: Record<string, unknown>;
+  meta: Record<string, unknown>;
+}
+
+function addFile(
+  output: RegistryDiffOutput,
+  config: ComponentsConfig,
+  inSrcDir: boolean,
+  relativeFilePath: string,
+  content: string,
+): void {
+  if (!isBuiltinComponent(config, relativeFilePath)) {
+    output.files.push(
+      parseFilePath(inSrcDir, config, `./${relativeFilePath}`, content),
+    );
+  }
+}
+
+function addDependencies(
+  output: RegistryDiffOutput,
+  _initialPackageContents: string,
+  currentPackageContents: string,
+  usedPackages: Set<string>,
+): void {
+  const currentPackageJson = JSON.parse(currentPackageContents) as {
+    dependencies?: Record<string, string>;
+    devDependencies?: Record<string, string>;
+  };
+
+  const currentDependencies = currentPackageJson.dependencies ?? {};
+  const currentDevDependencies = currentPackageJson.devDependencies ?? {};
+
+  const shadcnNamespaces = new Set(
+    output.registryDependencies
+      .map((dep) => dep.split("/")[0])
+      .filter((ns) => ns === "@shadcn"),
+  );
+
+  const shouldKeepDep = (dep: string): boolean => {
+    if (!usedPackages.has(dep)) return false;
+    if (!shadcnNamespaces.size) return true;
+
+    if (dep === "shadcn/ui") return false;
+
+    for (const ns of shadcnNamespaces) {
+      if (dep === ns || dep === `${ns}/ui`) {
+        return false;
+      }
+    }
+
+    return true;
+  };
+
+  // Only include packages that are actually imported in the registry item files
+  // (and exist in package.json so we know dep vs devDep). No other deps.
+  output.dependencies = Object.keys(currentDependencies).filter(shouldKeepDep);
+  output.devDependencies = Object.keys(currentDevDependencies).filter(shouldKeepDep);
+}
+
+function scanWithSrcDir(
+  output: RegistryDiffOutput,
+  config: ComponentsConfig,
+  alteredFiles: ScannedFile[],
+): void {
+  for (const { path, content } of alteredFiles) {
+    if (path.startsWith("src/")) {
+      addFile(output, config, true, path.replace("src/", ""), content);
+    } else {
+      addFile(output, config, false, path, content);
+    }
+  }
+}
+
+function isInAppDir(filePath: string): boolean {
+  return filePath.startsWith("app/");
+}
+
+function scanWithoutSrcDir(
+  output: RegistryDiffOutput,
+  config: ComponentsConfig,
+  alteredFiles: ScannedFile[],
+): void {
+  const aliasedPaths = getAliasedPaths(config);
+
+  for (const { path, content } of alteredFiles) {
+    const inSrcDir = aliasedPaths.includes(path) || isInAppDir(path);
+    addFile(output, config, inSrcDir, path, content);
+  }
+}
+
+export function createDiff({
+  name,
+  config,
+  alteredFiles,
+  specificFiles,
+  currentFiles,
+  currentPackageJson,
+}: CreateDiffOptions): RegistryDiffOutput {
+  const output: RegistryDiffOutput = {
+    name,
+    type: "registry:block",
+    dependencies: [],
+    devDependencies: [],
+    registryDependencies: [],
+    files: [],
+    tailwind: {},
+    cssVars: {},
+    meta: {},
+  };
+
+  if (config.isSrcDir) {
+    scanWithSrcDir(output, config, alteredFiles);
+  } else {
+    scanWithoutSrcDir(output, config, alteredFiles);
+  }
+
+  output.registryDependencies = findComponentFiles(config, currentFiles);
+
+  const usedPackages = extractImportedPackages(alteredFiles);
+  addDependencies(
+    output,
+    specificFiles["./package.json"],
+    currentPackageJson,
+    usedPackages,
+  );
+
+  return output;
+}
+