From bd5028e331ed8146f6c70ffe3933f03a0d193c79 Mon Sep 17 00:00:00 2001 From: shadcn Date: Fri, 13 Feb 2026 17:24:38 +0400 Subject: [PATCH] fix --- .../app/(create)/components/project-form.tsx | 215 +++++++++++------- apps/v4/app/(create)/init/route.ts | 1 + apps/v4/registry/config.ts | 1 + packages/shadcn/src/commands/init.ts | 2 +- 4 files changed, 137 insertions(+), 82 deletions(-) diff --git a/apps/v4/app/(create)/components/project-form.tsx b/apps/v4/app/(create)/components/project-form.tsx index 4140527e74..cd3755c688 100644 --- a/apps/v4/app/(create)/components/project-form.tsx +++ b/apps/v4/app/(create)/components/project-form.tsx @@ -32,7 +32,6 @@ import { RadioGroup, RadioGroupItem, } from "@/registry/new-york-v4/ui/radio-group" -import { Switch } from "@/registry/new-york-v4/ui/switch" import { Tabs, TabsContent, @@ -40,6 +39,7 @@ import { TabsTrigger, } from "@/registry/new-york-v4/ui/tabs" import { useDesignSystemSearchParams } from "@/app/(create)/lib/search-params" +import { FieldSeparator } from "@/examples/radix/ui/field" const TEMPLATES = [ { @@ -47,11 +47,6 @@ const TEMPLATES = [ title: "Next.js", logo: 'Next.js', }, - { - value: "next-monorepo", - title: "Next.js (Monorepo)", - logo: 'Next.js', - }, { value: "start", title: "TanStack Start", @@ -62,6 +57,11 @@ const TEMPLATES = [ title: "Vite", logo: '', }, + { + value: "next-monorepo", + title: "Next.js (Monorepo)", + logo: 'Next.js', + }, ] as const export function ProjectForm() { @@ -74,7 +74,7 @@ export function ProjectForm() { const commands = React.useMemo(() => { const origin = process.env.NEXT_PUBLIC_APP_URL || "http://localhost:4000" - const url = `${origin}/init?base=${params.base}&style=${params.style}&baseColor=${params.baseColor}&theme=${params.theme}&iconLibrary=${params.iconLibrary}&font=${params.font}&menuAccent=${params.menuAccent}&menuColor=${params.menuColor}&radius=${params.radius}&template=${params.template}&rtl=${params.rtl}` + const url = `${origin}/init?base=${params.base}&style=${params.style}&baseColor=${params.baseColor}&theme=${params.theme}&iconLibrary=${params.iconLibrary}&font=${params.font}&menuAccent=${params.menuAccent}&menuColor=${params.menuColor}&radius=${params.radius}&template=${params.template}&rtl=${params.rtl}&new=${params.new}` const rtlFlag = params.rtl ? " --rtl" : "" const templateFlag = params.template ? ` --template ${params.template}` : "" const isLocalDev = origin.includes("localhost") @@ -131,6 +131,12 @@ export function ProjectForm() { } }, [hasCopied]) + React.useEffect(() => { + if (!params.new && params.template === "next-monorepo") { + setParams({ template: "next" }) + } + }, [params.new, params.template, setParams]) + const handleCopy = React.useCallback(() => { const properties: Record = { command, @@ -160,25 +166,58 @@ export function ProjectForm() { Create Project - + - {params.new - ? "Create Project" - : "Initialize Project"} + Create Project - Run this command to initialize shadcn/ui in your project. + Configure your project to use shadcn/ui. - + + - - Select a template - + Are you creating a new project? + setParams({ new: value === "new" })} + className="grid grid-cols-2 gap-2" + > + + + + Yes + I'm creating a new project. + + + + + + + + No + + I have an existing project. + + + + + + - Which template would you like to use? + {params.new + ? `The cli will create a new project, install dependencies, add CSS variables and utils, configure dark mode and add an example component.` + : `The cli will install dependencies, add CSS variables and utils in your existing project.`} + + + + + {params.new + ? "Choose a starter template" + : "What framework is your existing project using?"} + - {TEMPLATES.map((template) => ( - - - - {template.logo && ( -
- )} - {template.title} - - - ))} - - - - - - Existing Project - - Initialize shadcn/ui in an existing project. - - - - setParams({ new: !checked }) - } - className="shadow-none" - /> - - + {TEMPLATES.map((template) => { + const isDisabled = !params.new && template.value === "next-monorepo" - - - - Enable RTL - - - View the RTL setup guide for {selectedTemplate?.title}. - - - - setParams({ rtl })} - className="shadow-none" - /> - - + + + {template.logo ? ( +
+ ) : null} + {template.title} + + + ) + })} + + + See the installation guides for more templates and frameworks. + + + + + Do you want to enable RTL? + setParams({ rtl: value === "yes" })} + className="grid grid-cols-2 gap-2" + > + + + + No + + Use default left-to-right layout. + + + + + + + + + Yes + + Enable right-to-left support. + + + + + + + + To learn more about RTL, see the + RTL setup guide + for {selectedTemplate?.title}. + + diff --git a/apps/v4/app/(create)/init/route.ts b/apps/v4/app/(create)/init/route.ts index 606edba2a7..6b13e04652 100644 --- a/apps/v4/app/(create)/init/route.ts +++ b/apps/v4/app/(create)/init/route.ts @@ -20,6 +20,7 @@ export async function GET(request: NextRequest) { radius: searchParams.get("radius"), template: searchParams.get("template") ?? undefined, rtl: searchParams.get("rtl") === "true", + new: searchParams.get("new") !== "false", }) if (!result.success) { diff --git a/apps/v4/registry/config.ts b/apps/v4/registry/config.ts index bfe1e20b6e..edfdda7418 100644 --- a/apps/v4/registry/config.ts +++ b/apps/v4/registry/config.ts @@ -98,6 +98,7 @@ export const designSystemConfigSchema = z .enum(["next", "next-monorepo", "start", "vite"]) .default("next") .optional(), + new: z.boolean().default(true), }) .refine( (data) => { diff --git a/packages/shadcn/src/commands/init.ts b/packages/shadcn/src/commands/init.ts index a3e91bc6e7..66a8450ca2 100644 --- a/packages/shadcn/src/commands/init.ts +++ b/packages/shadcn/src/commands/init.ts @@ -281,7 +281,7 @@ export const init = new Command() // Build create URL with template param. const createUrl = getShadcnCreateUrl({ - command: "init", + new: hasPackageJson ? "false" : "true", ...(opts.rtl && { rtl: "true" }), ...(opts.template && { template: opts.template }), })