components-differ 1.0.0

package/README.md

@@ -0,0 +1,31 @@
+# ShadCN Project Differ
+
+This CLI tool figures out the difference between the initial commit of a ShadCN project and the current state of the project and creates a new ShadCN JSON output file with the changes. This ShadCN JSON file can then be used with the ShadCN CLI to generate a new project or add to an existing project.
+
+# Steps
+
+1. Create a new NextJS app
+2. Add ShadCN to the app
+3. Create a new initial commit; `rm -fr .git && git init && git add . && git commit -m "Initial commit"` or `npx components-differ --init`
+4. Make your updates to the project
+5. Run the CLI tool; `npx components-differ`
+
+The reason we are recreating the initial commit is so that the resulting JSON output is only the changes to the project after ShadCN was added, and not the entire project history.
+
+You can then take the resulting JSON ouput and host it on a URL, then use that with the ShadCN CLI to generate a new project or add to an existing project.
+
+```bash
+npx shadcn@latest init http://your-json-output-url
+```
+
+You can use the `--src-dir` flag if you want to use the `src` directory in your project.
+
+Or you can add the JSON output to an existing project:
+
+```bash
+npx shadcn@latest add http://your-json-output-url
+```
+
+# Why is this useful?
+
+This allows library maintainers or SaaS services to create a one step installer for their library or service into an existing project, or to bootstrap a new project with the library or service.

package/index.mjs

@@ -0,0 +1,114 @@
+#!/usr/bin/env node
+
+import fs from "node:fs";
+import path from "node:path";
+import { program } from "commander";
+
+import { scanForAlteredFiles, scanForFiles, hasSrcDir } from "./src/git.mjs";
+import { readComponentsManifest } from "./src/components.mjs";
+import { createDiff } from "./src/create-diff.mjs";
+import { execSync } from "node:child_process";
+
+
+program.option("-n, --name <name>").option('--init');
+program.parse();
+
+const options = program.opts();
+
+const runCommand = (command) => {
+  try {
+    execSync(command, { stdio: "inherit" });
+  } catch (error) {
+    console.error(`Failed to execute command: ${command}`);
+    process.exit(1);
+  }
+};
+
+const ensureGitignore = () => {
+  const dockerignorePath = path.join(process.cwd(), ".dockerignore");
+  if (!fs.existsSync(dockerignorePath)) {
+    console.log(".gitignore file is missing. Creating one...");
+    const content = `
+/node_modules
+/.pnp
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/versions
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# env files (can opt-in for committing if needed)
+.env*
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+`;
+    fs.writeFileSync(dockerignorePath, content, "utf8");
+    console.log(".dockerignore file created with default rules.");
+  } else {
+    console.log(".dockerignore file already exists.");
+  }
+};
+
+const main = () => {
+  if (options.init) {
+    console.log("Initializing git repository for new component");
+    // Cross-platform logic
+    if (process.platform === "win32") {
+      runCommand("rmdir /s /q .git && git init && git add . && git commit -m \"Initial commit\"");
+    } else {
+      runCommand("rm -fr .git && git init && git add . && git commit -m \"Initial commit\"");
+    }
+    ensureGitignore()
+    return;
+  }
+
+  const name = options.name || path.basename(process.cwd());
+
+  const { alteredFiles, specificFiles } = scanForAlteredFiles([
+    "./package.json",
+  ]);
+  const currentFiles = scanForFiles(process.cwd());
+
+  const currentPackageJson = fs.readFileSync("./package.json", "utf-8");
+
+  const config = readComponentsManifest(process.cwd());
+  config.isSrcDir = hasSrcDir(process.cwd());
+
+  const output = createDiff({
+    name,
+    config,
+    alteredFiles,
+    currentFiles,
+    specificFiles,
+    currentPackageJson,
+  });
+
+  console.log(JSON.stringify(output, null, 2));
+};
+
+main();

package/package.json

@@ -0,0 +1,38 @@
+{
+  "name": "components-differ",
+  "version": "1.0.0",
+  "description": "Simple CLI to create Shadcn components from project",
+  "main": "index.mjs",
+  "bin": "index.mjs",
+  "directories": {
+    "test": "tests"
+  },
+  "dependencies": {
+    "commander": "^12.1.0",
+    "ignore": "^6.0.2",
+    "components-differ": "^1.0.3"
+  },
+  "devDependencies": {
+    "vitest": "^2.1.1"
+  },
+  "scripts": {
+    "test": "npx vitest"
+  },
+  "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"
+}

package/src/components.mjs

@@ -0,0 +1,98 @@
+import path from "node:path";
+import fs from "node:fs";
+
+const WHITELISTED_COMPONENTS = [
+  "accordion",
+  "alert",
+  "alert-dialog",
+  "aspect-ratio",
+  "avatar",
+  "badge",
+  "breadcrumb",
+  "button",
+  "calendar",
+  "card",
+  "carousel",
+  "chart",
+  "checkbox",
+  "collapsible",
+  "command",
+  "context-menu",
+  "table",
+  "dialog",
+  "drawer",
+  "dropdown-menu",
+  "form",
+  "hover-card",
+  "input",
+  "input-otp",
+  "label",
+  "menubar",
+  "navigation-menu",
+  "pagination",
+  "popover",
+  "progress",
+  "radio-group",
+  "resizable",
+  "scroll-area",
+  "select",
+  "separator",
+  "sheet",
+  "skeleton",
+  "slider",
+  "sonner",
+  "switch",
+  "tabs",
+  "textarea",
+  "toast",
+  "toggle",
+  "toggle-group",
+  "tooltip",
+];
+
+export function findComponentFiles(config, originalFiles) {
+  const registryDependencies = [];
+  const compDir = config.ui.replace("@/", config.isSrcDir ? "src/" : "");
+  for (const { path: filePath } of originalFiles) {
+    if (filePath.startsWith(compDir)) {
+      const fileExtension = path.extname(filePath);
+      const fileName = path.basename(filePath, fileExtension);
+      if (
+        (fileExtension === ".tsx" || fileExtension === ".jsx") &&
+        WHITELISTED_COMPONENTS.includes(fileName)
+      ) {
+        registryDependencies.push(path.basename(filePath, fileExtension));
+      }
+    }
+  }
+  return registryDependencies;
+}
+
+export function readComponentsManifest(dir) {
+  const manifestPath = path.join(dir, "./components.json");
+  if (fs.existsSync(manifestPath)) {
+    const config = JSON.parse(fs.readFileSync(manifestPath, "utf-8")).aliases;
+    return config;
+  } else {
+    console.error("Components manifest not found");
+    process.exit(1);
+  }
+}
+
+export function getAliasedPaths(config) {
+  return [
+    config.components.replace("@/", ""),
+    config.utils.replace("@/", ""),
+    config.ui.replace("@/", ""),
+    config.lib.replace("@/", ""),
+    config.hooks.replace("@/", ""),
+  ];
+}
+
+export function isBuiltinComponent(config, filePath) {
+  if (filePath.startsWith(config.ui.replace("@/", ""))) {
+    const component = path.basename(filePath, path.extname(filePath));
+    return WHITELISTED_COMPONENTS.includes(component);
+  }
+  return false;
+}

package/src/create-diff.mjs

@@ -0,0 +1,91 @@
+import {
+  findComponentFiles,
+  getAliasedPaths,
+  isBuiltinComponent,
+} from "./components.mjs";
+import { parseFilePath } from "./parse-file-path.mjs";
+
+function addFile(output, config, inSrcDir, relativeFilePath, content) {
+  if (!isBuiltinComponent(config, relativeFilePath)) {
+    output.files.push(
+      parseFilePath(inSrcDir, config, `./${relativeFilePath}`, content)
+    );
+  }
+}
+
+function addDependencies(
+  output,
+  initialPackageContents,
+  currentPackageContents
+) {
+  const initialPackageJson = JSON.parse(initialPackageContents);
+  const currentPackageJson = JSON.parse(currentPackageContents);
+
+  output.dependencies = Object.keys(
+    currentPackageJson.dependencies || {}
+  ).filter((dep) => !initialPackageJson.dependencies.hasOwnProperty(dep));
+  output.devDependencies = Object.keys(
+    currentPackageJson.devDependencies || {}
+  ).filter((dep) => !initialPackageJson.devDependencies.hasOwnProperty(dep));
+}
+
+function scanWithSrcDir(output, config, alteredFiles) {
+  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(path) {
+  return path.startsWith("app/");
+}
+
+function scanWithoutSrcDir(output, config, alteredFiles) {
+  const aliasedPaths = getAliasedPaths(config);
+
+  for (const { path, content } of alteredFiles) {
+    addFile(
+      output,
+      config,
+      aliasedPaths.includes(path) || isInAppDir(path),
+      path,
+      content
+    );
+  }
+}
+
+export function createDiff({
+  name,
+  config,
+  alteredFiles,
+  specificFiles,
+  currentFiles,
+  currentPackageJson,
+}) {
+  const output = {
+    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);
+
+  addDependencies(output, specificFiles["./package.json"], currentPackageJson);
+
+  return output;
+}

package/src/git.mjs

@@ -0,0 +1,141 @@
+import fs from "node:fs";
+import path from "node:path";
+import { execSync } from "node:child_process";
+import ignore from "ignore";
+import { start } from "node:repl";
+
+const INITIAL_DIR = "_initial";
+
+const EXCLUDE_DIRS = [
+  "node_modules",
+  "dist",
+  "fonts",
+  "build",
+  "public",
+  "static",
+  ".next",
+  ".git",
+  INITIAL_DIR,
+];
+
+const EXCLUDE_FILES = [
+  ".DS_Store",
+  "next-env.d.ts",
+  "package-lock.json",
+  "yarn.lock",
+  "pnpm-lock.yaml",
+  "bun.lockb",
+  "package.json",
+  "tailwind.config.ts",
+  "tailwind.config.js",
+  "components.json",
+  "favicon.ico",
+];
+
+function cloneInitialCommit() {
+  deleteInitialDir();
+
+  try {
+    // Get the initial commit hash
+    const initialCommit = execSync("git rev-list --max-parents=0 HEAD")
+      .toString()
+      .trim();
+
+    // Clone the initial commit quietly
+    execSync(`git worktree add -f ${INITIAL_DIR} ${initialCommit}`, {
+      stdio: "ignore",
+    });
+  } catch (error) {
+    console.error("Error cloning initial commit:", error.message);
+    process.exit(1);
+  }
+}
+
+function deleteInitialDir() {
+  if (fs.existsSync(INITIAL_DIR)) {
+    fs.rmSync(INITIAL_DIR, { recursive: true });
+
+    try {
+      execSync("git worktree prune", { stdio: "ignore" });
+    } catch (error) {
+      console.error("Error pruning git worktree:", error.message);
+    }
+  }
+}
+
+function checkIfFileIsChanged(relativeFilePath) {
+  const initialFilePath = path.join(INITIAL_DIR, relativeFilePath);
+  const fullPath = path.join(process.cwd(), relativeFilePath);
+  if (!fs.existsSync(initialFilePath)) {
+    return true; // New file
+  }
+  const currentContent = fs.readFileSync(fullPath, "utf-8");
+  const initialContent = fs.readFileSync(initialFilePath, "utf-8");
+  return currentContent !== initialContent;
+}
+
+export function scanForFiles(startDir, checkFile = false) {
+  const foundFiles = [];
+
+  let ignorer = () => false;
+  if (fs.existsSync(path.join(startDir, ".gitignore"))) {
+    const gitIgnore = ignore().add(
+      fs.readFileSync(path.join(startDir, ".gitignore")).toString()
+    );
+    ignorer = (relativeFilePath) => {
+      return gitIgnore.ignores(relativeFilePath);
+    };
+  }
+
+  function scanDirectory(dir, relativePath = "") {
+    const entries = fs.readdirSync(dir, { withFileTypes: true });
+
+    for (const entry of entries) {
+      const fullPath = path.join(dir, entry.name);
+      const relativeFilePath = path.join(relativePath, entry.name);
+
+      if (entry.isDirectory()) {
+        if (!EXCLUDE_DIRS.includes(entry.name)) {
+          scanDirectory(path.join(dir, entry.name), relativeFilePath);
+        }
+      } else if (
+        !checkFile ||
+        (checkFile && checkIfFileIsChanged(relativeFilePath))
+      ) {
+        if (!EXCLUDE_FILES.includes(entry.name) && !ignorer(relativeFilePath)) {
+          foundFiles.push({
+            path: relativeFilePath,
+            content: fs.readFileSync(fullPath, "utf-8"),
+          });
+        }
+      }
+    }
+  }
+
+  scanDirectory(startDir);
+
+  return foundFiles;
+}
+
+export function scanForAlteredFiles(specificFilesToReturn = []) {
+  cloneInitialCommit();
+
+  const alteredFiles = scanForFiles(process.cwd(), true);
+
+  const specificFiles = specificFilesToReturn.reduce((out, file) => {
+    const fullPath = path.join(process.cwd(), INITIAL_DIR, file);
+    out[file] = fs.readFileSync(fullPath, "utf-8");
+    return out;
+  }, {});
+
+  deleteInitialDir();
+
+  return {
+    alteredFiles,
+    specificFiles,
+  };
+}
+
+export function hasSrcDir(dir) {
+  return fs.existsSync(path.join(dir, "src"));
+}

package/src/parse-file-path.mjs

@@ -0,0 +1,32 @@
+function fixAlias(alias) {
+  return alias.replace("@", ".");
+}
+
+export function parseFilePath(wasInSrcDir, config, filePath, content) {
+  const out = {
+    path: filePath,
+    content,
+    type: "registry:example",
+    target: wasInSrcDir ? filePath : `~/${filePath.replace("./", "")}`,
+  };
+
+  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;
+  }
+
+  if (out.type === "registry:example") {
+    out.path = filePath;
+  }
+
+  return out;
+}

package/tests/fixtures/non-src-dir/app/page.tsx

@@ -0,0 +1 @@
+page;

package/tests/fixtures/non-src-dir/components/comp.tsx

@@ -0,0 +1 @@
+comp;

package/tests/fixtures/non-src-dir/components/ui/new-ui-comp.tsx

@@ -0,0 +1 @@
+new-ui-comp;

package/tests/fixtures/non-src-dir/components/ui/select.tsx

@@ -0,0 +1 @@
+select;

package/tests/fixtures/non-src-dir/components.json

@@ -0,0 +1,20 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "new-york",
+  "rsc": true,
+  "tsx": true,
+  "tailwind": {
+    "config": "tailwind.config.ts",
+    "css": "src/app/globals.css",
+    "baseColor": "neutral",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  }
+}

package/tests/fixtures/non-src-dir/hooks/hook.ts

@@ -0,0 +1 @@
+hook;

package/tests/fixtures/non-src-dir/lib/lib.ts

@@ -0,0 +1 @@
+lib;

package/tests/fixtures/non-src-dir/non-src-sub/test.ts

@@ -0,0 +1 @@
+non - src - sub;

package/tests/fixtures/non-src-dir/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "template",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint"
+  },
+  "dependencies": {
+    "@radix-ui/react-avatar": "^1.1.0",
+    "@radix-ui/react-collapsible": "^1.1.0",
+    "@radix-ui/react-dialog": "^1.1.1",
+    "@radix-ui/react-dropdown-menu": "^2.1.1",
+    "@radix-ui/react-icons": "^1.3.0",
+    "@radix-ui/react-popover": "^1.1.1",
+    "@radix-ui/react-progress": "^1.1.0",
+    "@radix-ui/react-separator": "^1.1.0",
+    "@radix-ui/react-slot": "^1.1.0",
+    "@workos-inc/authkit-nextjs": "^0.10.1",
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.1.1",
+    "lucide-react": "^0.441.0",
+    "next": "14.2.11",
+    "react": "^18",
+    "react-dom": "^18",
+    "tailwind-merge": "^2.5.2",
+    "tailwindcss-animate": "^1.0.7",
+    "vaul": "^0.9.3"
+  },
+  "devDependencies": {
+    "@types/node": "^20",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
+    "eslint": "^8",
+    "eslint-config-next": "14.2.11",
+    "postcss": "^8",
+    "tailwindcss": "^3.4.1",
+    "typescript": "^5"
+  }
+}

package/tests/fixtures/src-dir/components.json

@@ -0,0 +1,20 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "new-york",
+  "rsc": true,
+  "tsx": true,
+  "tailwind": {
+    "config": "tailwind.config.ts",
+    "css": "src/app/globals.css",
+    "baseColor": "neutral",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  }
+}

package/tests/fixtures/src-dir/non-src-sub/test.ts

@@ -0,0 +1 @@
+non - src - sub;

package/tests/fixtures/src-dir/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "template",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint"
+  },
+  "dependencies": {
+    "@radix-ui/react-avatar": "^1.1.0",
+    "@radix-ui/react-collapsible": "^1.1.0",
+    "@radix-ui/react-dialog": "^1.1.1",
+    "@radix-ui/react-dropdown-menu": "^2.1.1",
+    "@radix-ui/react-icons": "^1.3.0",
+    "@radix-ui/react-popover": "^1.1.1",
+    "@radix-ui/react-progress": "^1.1.0",
+    "@radix-ui/react-separator": "^1.1.0",
+    "@radix-ui/react-slot": "^1.1.0",
+    "@workos-inc/authkit-nextjs": "^0.10.1",
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.1.1",
+    "lucide-react": "^0.441.0",
+    "next": "14.2.11",
+    "react": "^18",
+    "react-dom": "^18",
+    "tailwind-merge": "^2.5.2",
+    "tailwindcss-animate": "^1.0.7",
+    "vaul": "^0.9.3"
+  },
+  "devDependencies": {
+    "@types/node": "^20",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
+    "eslint": "^8",
+    "eslint-config-next": "14.2.11",
+    "postcss": "^8",
+    "tailwindcss": "^3.4.1",
+    "typescript": "^5"
+  }
+}

package/tests/fixtures/src-dir/src/app/page.tsx

@@ -0,0 +1 @@
+page;

package/tests/fixtures/src-dir/src/components/comp.tsx

@@ -0,0 +1 @@
+comp;

package/tests/fixtures/src-dir/src/components/ui/new-ui-comp.tsx

@@ -0,0 +1 @@
+new-ui-comp;

package/tests/fixtures/src-dir/src/components/ui/select.tsx

@@ -0,0 +1 @@
+select;

package/tests/fixtures/src-dir/src/hooks/hook.ts

@@ -0,0 +1 @@
+hook;

package/tests/fixtures/src-dir/src/lib/lib.ts

@@ -0,0 +1 @@
+lib;

package/tests/tests/__snapshots__/test-fixtures.spec.mjs.snap

@@ -0,0 +1,129 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`fixture tests > should diff a non-src directory project 1`] = `
+{
+  "cssVars": {},
+  "dependencies": [],
+  "devDependencies": [],
+  "files": [
+    {
+      "content": "example env;",
+      "path": "./.env.example",
+      "target": "~/.env.example",
+      "type": "registry:example",
+    },
+    {
+      "content": "page;
+",
+      "path": "./app/page.tsx",
+      "target": "./app/page.tsx",
+      "type": "registry:example",
+    },
+    {
+      "content": "comp;
+",
+      "path": "./components/comp.tsx",
+      "target": undefined,
+      "type": "registry:block",
+    },
+    {
+      "content": "new-ui-comp;",
+      "path": "./components/ui/new-ui-comp.tsx",
+      "target": undefined,
+      "type": "registry:ui",
+    },
+    {
+      "content": "hook;
+",
+      "path": "./hooks/hook.ts",
+      "target": undefined,
+      "type": "registry:hook",
+    },
+    {
+      "content": "lib;
+",
+      "path": "./lib/lib.ts",
+      "target": undefined,
+      "type": "registry:lib",
+    },
+    {
+      "content": "non - src - sub;
+",
+      "path": "./non-src-sub/test.ts",
+      "target": "~/non-src-sub/test.ts",
+      "type": "registry:example",
+    },
+  ],
+  "meta": {},
+  "name": "example",
+  "registryDependencies": [
+    "select",
+  ],
+  "tailwind": {},
+  "type": "registry:block",
+}
+`;
+
+exports[`fixture tests > should diff a src directory project 1`] = `
+{
+  "cssVars": {},
+  "dependencies": [],
+  "devDependencies": [],
+  "files": [
+    {
+      "content": "example env;",
+      "path": "./.env.example",
+      "target": "~/.env.example",
+      "type": "registry:example",
+    },
+    {
+      "content": "non - src - sub;
+",
+      "path": "./non-src-sub/test.ts",
+      "target": "~/non-src-sub/test.ts",
+      "type": "registry:example",
+    },
+    {
+      "content": "page;
+",
+      "path": "./app/page.tsx",
+      "target": "./app/page.tsx",
+      "type": "registry:example",
+    },
+    {
+      "content": "comp;
+",
+      "path": "./components/comp.tsx",
+      "target": undefined,
+      "type": "registry:block",
+    },
+    {
+      "content": "new-ui-comp;",
+      "path": "./components/ui/new-ui-comp.tsx",
+      "target": undefined,
+      "type": "registry:ui",
+    },
+    {
+      "content": "hook;
+",
+      "path": "./hooks/hook.ts",
+      "target": undefined,
+      "type": "registry:hook",
+    },
+    {
+      "content": "lib;
+",
+      "path": "./lib/lib.ts",
+      "target": undefined,
+      "type": "registry:lib",
+    },
+  ],
+  "meta": {},
+  "name": "example",
+  "registryDependencies": [
+    "select",
+  ],
+  "tailwind": {},
+  "type": "registry:block",
+}
+`;

package/tests/tests/parse-file-path.spec.mjs

@@ -0,0 +1,105 @@
+import { describe, expect, test } from "vitest";
+import { parseFilePath } from "../../src/parse-file-path.mjs";
+
+const CONFIG_IN_SRC = {
+  components: "@/components",
+  utils: "@/lib/utils",
+  ui: "@/components/ui",
+  lib: "@/lib",
+  hooks: "@/hooks",
+  isSrcDir: true,
+};
+const CONFIG = {
+  ...CONFIG_IN_SRC,
+  isSrcDir: false,
+};
+
+const trim = ({ path, type, target }) => ({
+  path,
+  type,
+  target,
+});
+
+describe("parseFilePath", () => {
+  test("should handle a new component in a src directory", () => {
+    expect(
+      trim(
+        parseFilePath(
+          true,
+          CONFIG_IN_SRC,
+          "./components/spinning-credit-card.tsx"
+        )
+      )
+    ).toEqual({
+      type: "registry:block",
+      path: "./components/spinning-credit-card.tsx",
+    });
+  });
+
+  test("should handle a new component", () => {
+    expect(
+      trim(
+        parseFilePath(false, CONFIG, "./components/spinning-credit-card.tsx")
+      )
+    ).toEqual({
+      type: "registry:block",
+      path: "./components/spinning-credit-card.tsx",
+    });
+  });
+
+  test("should handle a new page in a src directory", () => {
+    expect(trim(parseFilePath(true, CONFIG_IN_SRC, "./app/page.tsx"))).toEqual({
+      type: "registry:example",
+      target: "./app/page.tsx",
+      path: "./app/page.tsx",
+    });
+  });
+
+  test("should handle a new page in an app directory", () => {
+    expect(trim(parseFilePath(true, CONFIG, "./app/page.tsx"))).toEqual({
+      type: "registry:example",
+      target: "./app/page.tsx",
+      path: "./app/page.tsx",
+    });
+  });
+
+  test("should handle an environment file with a src directory", () => {
+    expect(trim(parseFilePath(false, CONFIG_IN_SRC, "./.env.example"))).toEqual(
+      {
+        type: "registry:example",
+        target: "~/.env.example",
+        path: "./.env.example",
+      }
+    );
+  });
+
+  test("should handle an environment file", () => {
+    expect(trim(parseFilePath(false, CONFIG, "./.env.example"))).toEqual({
+      type: "registry:example",
+      target: "~/.env.example",
+      path: "./.env.example",
+    });
+  });
+
+  test("should handle a new hook", () => {
+    expect(
+      trim(
+        parseFilePath(
+          false,
+          CONFIG_IN_SRC,
+          "./hooks/use-spinning-credit-card.ts"
+        )
+      )
+    ).toEqual({
+      type: "registry:hook",
+      path: "./hooks/use-spinning-credit-card.ts",
+    });
+  });
+
+  test("should handle a new library file", () => {
+    expect(trim(parseFilePath(true, CONFIG_IN_SRC, "./lib/utils.ts"))).toEqual({
+      type: "registry:lib",
+      path: "./lib/utils.ts",
+    });
+  });
+});

package/tests/tests/test-fixtures.spec.mjs

@@ -0,0 +1,86 @@
+import { describe, expect, test } from "vitest";
+import fs from "node:fs";
+import path from "node:path";
+
+import { scanForFiles, hasSrcDir } from "../../src/git.mjs";
+import { readComponentsManifest } from "../../src/components.mjs";
+import { createDiff } from "../../src/create-diff.mjs";
+
+const EXPECTED_FILES = [
+  {
+    path: "./.env.example",
+    content: "example env;",
+    type: "registry:example",
+    target: "~/.env.example",
+  },
+  {
+    path: "./non-src-sub/test.ts",
+    content: "non - src - sub;\n",
+    type: "registry:example",
+    target: "~/non-src-sub/test.ts",
+  },
+  {
+    path: "./app/page.tsx",
+    content: "page;\n",
+    type: "registry:example",
+    target: "./app/page.tsx",
+  },
+  {
+    path: "./components/comp.tsx",
+    content: "comp;\n",
+    type: "registry:block",
+    target: undefined,
+  },
+  {
+    path: "./components/ui/new-ui-comp.tsx",
+    content: "new-ui-comp;",
+    type: "registry:ui",
+    target: undefined,
+  },
+  {
+    path: "./hooks/hook.ts",
+    content: "hook;\n",
+    type: "registry:hook",
+    target: undefined,
+  },
+  {
+    path: "./lib/lib.ts",
+    content: "lib;\n",
+    type: "registry:lib",
+    target: undefined,
+  },
+];
+
+function createDiffRequest(dir) {
+  const currentFiles = scanForFiles(dir);
+
+  const config = readComponentsManifest(dir);
+  config.isSrcDir = hasSrcDir(dir);
+
+  const specificFiles = {
+    "./package.json": fs.readFileSync(
+      path.join(dir, "./package.json"),
+      "utf-8"
+    ),
+  };
+
+  return {
+    name: "example",
+    config,
+    alteredFiles: currentFiles,
+    specificFiles,
+    currentFiles,
+    currentPackageJson: specificFiles["./package.json"],
+  };
+}
+
+describe("fixture tests", () => {
+  test("should diff a src directory project", () => {
+    const diff = createDiff(createDiffRequest("./tests/fixtures/src-dir"));
+    expect(diff).toMatchSnapshot();
+  });
+  test("should diff a non-src directory project", () => {
+    const diff = createDiff(createDiffRequest("./tests/fixtures/non-src-dir"));
+    expect(diff).toMatchSnapshot();
+  });
+});