diff() — ui Function Reference

Architecture documentation for the diff() function in diff.ts from the ui codebase.

Function typescript FrameworkTooling TemplateSync calls 2

Entity Profile

FrameworkTooling→ TemplateSync→ diff() — ui Function Reference

Dependency Diagram

graph TD
  b4fcf087_084f_27d7_c2a4_74d4dadef3b5["diff()"]
  d3456bc0_654c_565f_5730_78cca3c9f4c8["diff.ts"]
  b4fcf087_084f_27d7_c2a4_74d4dadef3b5 -->|defined in| d3456bc0_654c_565f_5730_78cca3c9f4c8
  10184aee_4172_7de0_9408_131d59d38e8a["diffComponent()"]
  b4fcf087_084f_27d7_c2a4_74d4dadef3b5 -->|calls| 10184aee_4172_7de0_9408_131d59d38e8a
  9a760ff0_ddbf_cb47_2318_30f38613133e["printDiff()"]
  b4fcf087_084f_27d7_c2a4_74d4dadef3b5 -->|calls| 9a760ff0_ddbf_cb47_2318_30f38613133e
  style b4fcf087_084f_27d7_c2a4_74d4dadef3b5 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/shadcn/src/commands/diff.ts lines 36–145

  .action(async (name, opts) => {
    try {
      const options = updateOptionsSchema.parse({
        component: name,
        ...opts,
      })

      const cwd = path.resolve(options.cwd)

      if (!existsSync(cwd)) {
        logger.error(`The path ${cwd} does not exist. Please try again.`)
        process.exit(1)
      }

      const config = await getConfig(cwd)
      if (!config) {
        logger.warn(
          `Configuration is missing. Please run ${highlighter.success(
            `init`
          )} to create a components.json file.`
        )
        process.exit(1)
      }

      const registryIndex = await getShadcnRegistryIndex()

      if (!registryIndex) {
        handleError(new Error("Failed to fetch registry index."))
        process.exit(1)
      }

      if (!options.component) {
        const targetDir = config.resolvedPaths.components

        // Find all components that exist in the project.
        const projectComponents = registryIndex.filter((item) => {
          for (const file of item.files ?? []) {
            const filePath = path.resolve(
              targetDir,
              typeof file === "string" ? file : file.path
            )
            if (existsSync(filePath)) {
              return true
            }
          }

          return false
        })

        // Check for updates.
        const componentsWithUpdates = []
        for (const component of projectComponents) {
          const changes = await diffComponent(component, config)
          if (changes.length) {
            componentsWithUpdates.push({
              name: component.name,
              changes,
            })
          }
        }

        if (!componentsWithUpdates.length) {
          logger.info("No updates found.")
          process.exit(0)
        }

        logger.info("The following components have updates available:")
        for (const component of componentsWithUpdates) {
          logger.info(`- ${component.name}`)
          for (const change of component.changes) {
            logger.info(`  - ${change.filePath}`)
          }
        }
        logger.break()
        logger.info(
          `Run ${highlighter.success(`diff <component>`)} to see the changes.`
        )
        process.exit(0)
      }

      // Show diff for a single component.