feat(shadcn): add experimental docs (#4820)

* feat(shadcn): add cli docs

* chore: add changeset

* fix: tests

.changeset/small-foxes-destroy.md

@@ -0,0 +1,5 @@
+---
+"shadcn": patch
+---
+
+add docs support

apps/www/registry/schema.ts

@@ -62,6 +62,7 @@ export const registryEntrySchema = z.object({
   category: z.string().optional(),
   subcategory: z.string().optional(),
   chunks: z.array(blockChunkSchema).optional(),
+  docs: z.string().optional(),
 })
 
 export const registrySchema = z.array(registryEntrySchema)

packages/shadcn/src/utils/add-components.ts

@@ -1,5 +1,6 @@
 import { type Config } from "@/src/utils/get-config"
 import { handleError } from "@/src/utils/handle-error"
+import { logger } from "@/src/utils/logger"
 import { registryResolveItemsTree } from "@/src/utils/registry"
 import { spinner } from "@/src/utils/spinner"
 import { updateCssVars } from "@/src/utils/updaters/update-css-vars"
@@ -48,4 +49,8 @@ export async function addComponents(
     overwrite: options.overwrite,
     silent: options.silent,
   })
+
+  if (tree.docs) {
+    logger.info(tree.docs)
+  }
 }

packages/shadcn/src/utils/registry/index.ts

@@ -321,6 +321,13 @@ export async function registryResolveItemsTree(
       cssVars = deepmerge(cssVars, item.cssVars ?? {})
     })
 
+    let docs = ""
+    payload.forEach((item) => {
+      if (item.docs) {
+        docs += `${item.docs}\n`
+      }
+    })
+
     return registryResolvedItemsTreeSchema.parse({
       dependencies: deepmerge.all(
         payload.map((item) => item.dependencies ?? [])
@@ -331,6 +338,7 @@ export async function registryResolveItemsTree(
       files: deepmerge.all(payload.map((item) => item.files ?? [])),
       tailwind,
       cssVars,
+      docs,
     })
   } catch (error) {
     handleError(error)

packages/shadcn/src/utils/registry/schema.ts

@@ -46,6 +46,7 @@ export const registryItemSchema = z.object({
   tailwind: registryItemTailwindSchema.optional(),
   cssVars: registryItemCssVarsSchema.optional(),
   meta: z.record(z.string(), z.any()).optional(),
+  docs: z.string().optional(),
 })
 
 export type RegistryItem = z.infer<typeof registryItemSchema>
@@ -82,4 +83,5 @@ export const registryResolvedItemsTreeSchema = registryItemSchema.pick({
   files: true,
   tailwind: true,
   cssVars: true,
+  docs: true,
 })

packages/shadcn/test/utils/schema/__snapshots__/registry-resolve-items-tree.test.ts.snap

@@ -20,6 +20,7 @@ exports[`registryResolveItemTree > should resolve index 1`] = `
     "tailwind-merge",
   ],
   "devDependencies": [],
+  "docs": "",
   "files": [
     {
       "content": ""use client"
@@ -93,6 +94,7 @@ exports[`registryResolveItemTree > should resolve items tree 1`] = `
     "@radix-ui/react-slot",
   ],
   "devDependencies": [],
+  "docs": "",
   "files": [
     {
       "content": "import * as React from "react"
@@ -171,6 +173,7 @@ exports[`registryResolveItemTree > should resolve multiple items tree 1`] = `
     "@radix-ui/react-dialog",
   ],
   "devDependencies": [],
+  "docs": "",
   "files": [
     {
       "content": "import * as React from "react"