Skip to content

Commit fc8e994

Browse files
AmanVarshney01AmanVarshney01
committed
Migrate to radix-ui monorepo package and update imports
1 parent ed6c3dd commit fc8e994

File tree

20 files changed

+133
-96
lines changed

20 files changed

+133
-96
lines changed

‎.changeset/wild-phones-feel.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"create-better-t-stack": patch
3+
---
4+
5+
Migrate to radix-ui monorepo package and update imports

‎apps/cli/templates/frontend/react/next/package.json.hbs

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,7 @@
99
"lint": "next lint"
1010
},
1111
"dependencies": {
12-
"@radix-ui/react-checkbox": "^1.1.5",
13-
"@radix-ui/react-dropdown-menu": "^2.1.7",
14-
"@radix-ui/react-label": "^2.1.3",
15-
"@radix-ui/react-slot": "^1.2.0",
12+
"radix-ui": "^1.4.2",
1613
"@tanstack/react-form": "^1.3.2",
1714
"class-variance-authority": "^0.7.1",
1815
"clsx": "^2.1.1",

‎apps/cli/templates/frontend/react/react-router/package.json

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,7 @@
99
"typecheck": "react-router typegen && tsc"
1010
},
1111
"dependencies": {
12-
"@radix-ui/react-checkbox": "^1.3.2",
13-
"@radix-ui/react-dropdown-menu": "^2.1.15",
14-
"@radix-ui/react-label": "^2.1.7",
15-
"@radix-ui/react-slot": "^1.2.3",
12+
"radix-ui": "^1.4.2",
1613
"@react-router/fs-routes": "^7.6.1",
1714
"@react-router/node": "^7.6.1",
1815
"@react-router/serve": "^7.6.1",

‎apps/cli/templates/frontend/react/tanstack-router/package.json

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -23,10 +23,7 @@
2323
},
2424
"dependencies": {
2525
"@hookform/resolvers": "^3.10.0",
26-
"@radix-ui/react-checkbox": "^1.1.4",
27-
"@radix-ui/react-dropdown-menu": "^2.1.6",
28-
"@radix-ui/react-label": "^2.1.2",
29-
"@radix-ui/react-slot": "^1.1.2",
26+
"radix-ui": "^1.4.2",
3027
"@tanstack/react-form": "^1.0.5",
3128
"@tailwindcss/vite": "^4.0.15",
3229
"@tanstack/react-router": "^1.114.25",

‎apps/cli/templates/frontend/react/tanstack-start/package.json

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,7 @@
88
"dev": "vite dev --port=3001"
99
},
1010
"dependencies": {
11-
"@radix-ui/react-checkbox": "^1.1.4",
12-
"@radix-ui/react-dropdown-menu": "^2.1.6",
13-
"@radix-ui/react-label": "^2.1.2",
14-
"@radix-ui/react-slot": "^1.1.2",
11+
"radix-ui": "^1.4.2",
1512
"@tanstack/react-form": "^1.0.5",
1613
"@tailwindcss/vite": "^4.1.8",
1714
"@tanstack/react-query": "^5.80.6",

‎apps/cli/templates/frontend/react/web-base/src/components/ui/button.tsx

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import * as React from "react";
2-
import { Slot } from "@radix-ui/react-slot";
3-
import { cva, type VariantProps } from "class-variance-authority";
1+
import * as React from "react"
2+
import { Slot as SlotPrimitive } from "radix-ui"
3+
import { cva, type VariantProps } from "class-variance-authority"
44

5-
import { cn } from "@/lib/utils";
5+
import { cn } from "@/lib/utils"
66

77
const buttonVariants = cva(
88
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
@@ -33,7 +33,7 @@ const buttonVariants = cva(
3333
size: "default",
3434
},
3535
}
36-
);
36+
)
3737

3838
function Button({
3939
className,
@@ -43,17 +43,17 @@ function Button({
4343
...props
4444
}: React.ComponentProps<"button"> &
4545
VariantProps<typeof buttonVariants> & {
46-
asChild?: boolean;
46+
asChild?: boolean
4747
}) {
48-
const Comp = asChild ? Slot : "button";
48+
const Comp = asChild ? SlotPrimitive.Slot : "button"
4949

5050
return (
5151
<Comp
5252
data-slot="button"
5353
className={cn(buttonVariants({ variant, size, className }))}
5454
{...props}
5555
/>
56-
);
56+
)
5757
}
5858

59-
export { Button, buttonVariants };
59+
export { Button, buttonVariants }

‎apps/cli/templates/frontend/react/web-base/src/components/ui/card.tsx

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import * as React from "react";
1+
import * as React from "react"
22

3-
import { cn } from "@/lib/utils";
3+
import { cn } from "@/lib/utils"
44

55
function Card({ className, ...props }: React.ComponentProps<"div">) {
66
return (
@@ -12,7 +12,7 @@ function Card({ className, ...props }: React.ComponentProps<"div">) {
1212
)}
1313
{...props}
1414
/>
15-
);
15+
)
1616
}
1717

1818
function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
@@ -25,7 +25,7 @@ function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
2525
)}
2626
{...props}
2727
/>
28-
);
28+
)
2929
}
3030

3131
function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
@@ -35,7 +35,7 @@ function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
3535
className={cn("leading-none font-semibold", className)}
3636
{...props}
3737
/>
38-
);
38+
)
3939
}
4040

4141
function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
@@ -45,7 +45,7 @@ function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
4545
className={cn("text-muted-foreground text-sm", className)}
4646
{...props}
4747
/>
48-
);
48+
)
4949
}
5050

5151
function CardAction({ className, ...props }: React.ComponentProps<"div">) {
@@ -58,7 +58,7 @@ function CardAction({ className, ...props }: React.ComponentProps<"div">) {
5858
)}
5959
{...props}
6060
/>
61-
);
61+
)
6262
}
6363

6464
function CardContent({ className, ...props }: React.ComponentProps<"div">) {
@@ -68,7 +68,7 @@ function CardContent({ className, ...props }: React.ComponentProps<"div">) {
6868
className={cn("px-6", className)}
6969
{...props}
7070
/>
71-
);
71+
)
7272
}
7373

7474
function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
@@ -78,7 +78,7 @@ function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
7878
className={cn("flex items-center px-6 [.border-t]:pt-6", className)}
7979
{...props}
8080
/>
81-
);
81+
)
8282
}
8383

8484
export {
@@ -89,4 +89,4 @@ export {
8989
CardAction,
9090
CardDescription,
9191
CardContent,
92-
};
92+
}

‎apps/cli/templates/frontend/react/web-base/src/components/ui/checkbox.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import * as React from "react";
2-
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
3-
import { CheckIcon } from "lucide-react";
1+
import * as React from "react"
2+
import { Checkbox as CheckboxPrimitive } from "radix-ui"
3+
import { CheckIcon } from "lucide-react"
44

5-
import { cn } from "@/lib/utils";
5+
import { cn } from "@/lib/utils"
66

77
function Checkbox({
88
className,
@@ -24,7 +24,7 @@ function Checkbox({
2424
<CheckIcon className="size-3.5" />
2525
</CheckboxPrimitive.Indicator>
2626
</CheckboxPrimitive.Root>
27-
);
27+
)
2828
}
2929

30-
export { Checkbox };
30+
export { Checkbox }

‎apps/cli/templates/frontend/react/web-base/src/components/ui/dropdown-menu.tsx

Lines changed: 26 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,23 @@
1-
import * as React from "react";
2-
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
3-
import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react";
1+
"use client"
42

5-
import { cn } from "@/lib/utils";
3+
import * as React from "react"
4+
import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui"
5+
import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react"
6+
7+
import { cn } from "@/lib/utils"
68

79
function DropdownMenu({
810
...props
911
}: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {
10-
return <DropdownMenuPrimitive.Root data-slot="dropdown-menu" {...props} />;
12+
return <DropdownMenuPrimitive.Root data-slot="dropdown-menu" {...props} />
1113
}
1214

1315
function DropdownMenuPortal({
1416
...props
1517
}: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {
1618
return (
1719
<DropdownMenuPrimitive.Portal data-slot="dropdown-menu-portal" {...props} />
18-
);
20+
)
1921
}
2022

2123
function DropdownMenuTrigger({
@@ -26,7 +28,7 @@ function DropdownMenuTrigger({
2628
data-slot="dropdown-menu-trigger"
2729
{...props}
2830
/>
29-
);
31+
)
3032
}
3133

3234
function DropdownMenuContent({
@@ -46,15 +48,15 @@ function DropdownMenuContent({
4648
{...props}
4749
/>
4850
</DropdownMenuPrimitive.Portal>
49-
);
51+
)
5052
}
5153

5254
function DropdownMenuGroup({
5355
...props
5456
}: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {
5557
return (
5658
<DropdownMenuPrimitive.Group data-slot="dropdown-menu-group" {...props} />
57-
);
59+
)
5860
}
5961

6062
function DropdownMenuItem({
@@ -63,8 +65,8 @@ function DropdownMenuItem({
6365
variant = "default",
6466
...props
6567
}: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
66-
inset?: boolean;
67-
variant?: "default" | "destructive";
68+
inset?: boolean
69+
variant?: "default" | "destructive"
6870
}) {
6971
return (
7072
<DropdownMenuPrimitive.Item
@@ -77,7 +79,7 @@ function DropdownMenuItem({
7779
)}
7880
{...props}
7981
/>
80-
);
82+
)
8183
}
8284

8385
function DropdownMenuCheckboxItem({
@@ -103,7 +105,7 @@ function DropdownMenuCheckboxItem({
103105
</span>
104106
{children}
105107
</DropdownMenuPrimitive.CheckboxItem>
106-
);
108+
)
107109
}
108110

109111
function DropdownMenuRadioGroup({
@@ -114,7 +116,7 @@ function DropdownMenuRadioGroup({
114116
data-slot="dropdown-menu-radio-group"
115117
{...props}
116118
/>
117-
);
119+
)
118120
}
119121

120122
function DropdownMenuRadioItem({
@@ -138,15 +140,15 @@ function DropdownMenuRadioItem({
138140
</span>
139141
{children}
140142
</DropdownMenuPrimitive.RadioItem>
141-
);
143+
)
142144
}
143145

144146
function DropdownMenuLabel({
145147
className,
146148
inset,
147149
...props
148150
}: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {
149-
inset?: boolean;
151+
inset?: boolean
150152
}) {
151153
return (
152154
<DropdownMenuPrimitive.Label
@@ -158,7 +160,7 @@ function DropdownMenuLabel({
158160
)}
159161
{...props}
160162
/>
161-
);
163+
)
162164
}
163165

164166
function DropdownMenuSeparator({
@@ -171,7 +173,7 @@ function DropdownMenuSeparator({
171173
className={cn("bg-border -mx-1 my-1 h-px", className)}
172174
{...props}
173175
/>
174-
);
176+
)
175177
}
176178

177179
function DropdownMenuShortcut({
@@ -187,13 +189,13 @@ function DropdownMenuShortcut({
187189
)}
188190
{...props}
189191
/>
190-
);
192+
)
191193
}
192194

193195
function DropdownMenuSub({
194196
...props
195197
}: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {
196-
return <DropdownMenuPrimitive.Sub data-slot="dropdown-menu-sub" {...props} />;
198+
return <DropdownMenuPrimitive.Sub data-slot="dropdown-menu-sub" {...props} />
197199
}
198200

199201
function DropdownMenuSubTrigger({
@@ -202,7 +204,7 @@ function DropdownMenuSubTrigger({
202204
children,
203205
...props
204206
}: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {
205-
inset?: boolean;
207+
inset?: boolean
206208
}) {
207209
return (
208210
<DropdownMenuPrimitive.SubTrigger
@@ -217,7 +219,7 @@ function DropdownMenuSubTrigger({
217219
{children}
218220
<ChevronRightIcon className="ml-auto size-4" />
219221
</DropdownMenuPrimitive.SubTrigger>
220-
);
222+
)
221223
}
222224

223225
function DropdownMenuSubContent({
@@ -233,7 +235,7 @@ function DropdownMenuSubContent({
233235
)}
234236
{...props}
235237
/>
236-
);
238+
)
237239
}
238240

239241
export {
@@ -252,4 +254,4 @@ export {
252254
DropdownMenuSub,
253255
DropdownMenuSubTrigger,
254256
DropdownMenuSubContent,
255-
};
257+
}

‎apps/cli/templates/frontend/react/web-base/src/components/ui/input.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import * as React from "react";
1+
import * as React from "react"
22

3-
import { cn } from "@/lib/utils";
3+
import { cn } from "@/lib/utils"
44

55
function Input({ className, type, ...props }: React.ComponentProps<"input">) {
66
return (
@@ -15,7 +15,7 @@ function Input({ className, type, ...props }: React.ComponentProps<"input">) {
1515
)}
1616
{...props}
1717
/>
18-
);
18+
)
1919
}
2020

21-
export { Input };
21+
export { Input }

0 commit comments

Comments
 (0)