Skip to content

Commit 9288f86

Browse files
committed
feat: version selector added and all command updated with v3 domain
1 parent a20f999 commit 9288f86

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

68 files changed

+1753
-2992
lines changed

__registry__/index.tsx

Lines changed: 1575 additions & 2793 deletions
Large diffs are not rendered by default.

components/main-nav.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ import { ExternalLinkIcon } from "@radix-ui/react-icons";
1515
import Link from "next/link";
1616
import { usePathname } from "next/navigation";
1717
import posthog from "posthog-js";
18-
18+
import { VersionSelect } from "@/components/version-select";
1919
function copyLogoAsSVG(path: string) {
2020
fetch(path)
2121
.then((response) => response.blob())
@@ -50,7 +50,6 @@ export function MainNav() {
5050
<span className="hidden font-bold md:inline-block">
5151
{siteConfig.name}
5252
</span>
53-
<Badge variant="secondary">V3</Badge>
5453
</Link>
5554
</ContextMenuTrigger>
5655
<ContextMenuContent>
@@ -70,6 +69,9 @@ export function MainNav() {
7069
</ContextMenuItem>
7170
</ContextMenuContent>
7271
</ContextMenu>
72+
<div className="mr-4">
73+
<VersionSelect />
74+
</div>
7375
<nav className="hidden items-center space-x-6 text-sm font-medium xl:flex">
7476
{docsConfig.mainNav.map((item) => (
7577
<Link
@@ -82,7 +84,7 @@ export function MainNav() {
8284
"flex items-center justify-center transition-colors hover:text-foreground/80",
8385
pathname?.startsWith(item.href!)
8486
? "text-foreground"
85-
: "text-foreground/60",
87+
: "text-foreground/60"
8688
)}
8789
>
8890
<span className="shrink-0">{item.title}</span>

components/sidebar-nav.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,9 @@ export function DocsSidebarNav({ items }: DocsSidebarNavProps) {
1818

1919
return items.length ? (
2020
<div className="flex flex-col gap-6">
21+
<p className="rounded-md px-2 py-1 text-sm font-medium underline underline-offset-4">
22+
Tailwind v3
23+
</p>
2124
{items.map((item, index) => (
2225
<div key={index} className="flex flex-col gap-1">
2326
<h4 className="rounded-md px-2 py-1 text-sm font-semibold">
@@ -58,7 +61,7 @@ export function DocsSidebarNavItems({
5861
"group relative flex h-8 w-full items-center justify-between rounded-lg px-2 font-normal text-foreground underline-offset-2 hover:bg-accent hover:text-accent-foreground",
5962
item.disabled && "cursor-not-allowed opacity-60",
6063
pathname === item.href &&
61-
"bg-accent font-medium text-accent-foreground",
64+
"bg-accent font-medium text-accent-foreground"
6265
)}
6366
target={item.external ? "_blank" : ""}
6467
rel={item.external ? "noreferrer" : ""}
@@ -99,7 +102,7 @@ export function DocsSidebarNavItems({
99102
key={index}
100103
className={cn(
101104
"flex w-full cursor-not-allowed items-center rounded-md p-2 text-muted-foreground",
102-
item.disabled && "cursor-not-allowed opacity-60",
105+
item.disabled && "cursor-not-allowed opacity-60"
103106
)}
104107
>
105108
{item.title}
@@ -114,7 +117,7 @@ export function DocsSidebarNavItems({
114117
</span>
115118
)}
116119
</span>
117-
),
120+
)
118121
)}
119122
</div>
120123
) : null;

components/ui/select.tsx

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -23,13 +23,15 @@ const SelectTrigger = React.forwardRef<
2323
ref={ref}
2424
className={cn(
2525
"flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
26-
className,
26+
className
2727
)}
2828
{...props}
2929
>
3030
{children}
3131
<SelectPrimitive.Icon asChild>
32-
<ChevronDownIcon className="h-4 w-4 opacity-50" />
32+
<div className="select-icon flex items-center justify-center">
33+
<ChevronDownIcon className="size-4 opacity-50" />
34+
</div>
3335
</SelectPrimitive.Icon>
3436
</SelectPrimitive.Trigger>
3537
));
@@ -43,7 +45,7 @@ const SelectScrollUpButton = React.forwardRef<
4345
ref={ref}
4446
className={cn(
4547
"flex cursor-default items-center justify-center py-1",
46-
className,
48+
className
4749
)}
4850
{...props}
4951
>
@@ -60,7 +62,7 @@ const SelectScrollDownButton = React.forwardRef<
6062
ref={ref}
6163
className={cn(
6264
"flex cursor-default items-center justify-center py-1",
63-
className,
65+
className
6466
)}
6567
{...props}
6668
>
@@ -81,7 +83,7 @@ const SelectContent = React.forwardRef<
8183
"relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
8284
position === "popper" &&
8385
"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
84-
className,
86+
className
8587
)}
8688
position={position}
8789
{...props}
@@ -91,7 +93,7 @@ const SelectContent = React.forwardRef<
9193
className={cn(
9294
"p-1",
9395
position === "popper" &&
94-
"h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]",
96+
"h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
9597
)}
9698
>
9799
{children}
@@ -122,7 +124,7 @@ const SelectItem = React.forwardRef<
122124
ref={ref}
123125
className={cn(
124126
"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
125-
className,
127+
className
126128
)}
127129
{...props}
128130
>

components/version-select.tsx

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
"use client";
2+
3+
import * as React from "react";
4+
import {
5+
DropdownMenu,
6+
DropdownMenuContent,
7+
DropdownMenuItem,
8+
DropdownMenuTrigger,
9+
} from "@/components/ui/dropdown-menu";
10+
import { Skeleton } from "@/components/ui/skeleton";
11+
import { ChevronDownIcon, CheckIcon } from "@radix-ui/react-icons";
12+
import { cn } from "@/lib/utils";
13+
14+
const DOMAINS = {
15+
v3: "https://v3.magicui.design",
16+
v4: "https://magicui.design",
17+
} as const;
18+
19+
export function VersionSelect() {
20+
const [mounted, setMounted] = React.useState(false);
21+
const [version, setVersion] = React.useState<keyof typeof DOMAINS>("v3");
22+
23+
// Only render the dropdown after component mounts
24+
React.useEffect(() => {
25+
setMounted(true);
26+
}, []);
27+
28+
const handleVersionChange = (value: keyof typeof DOMAINS) => {
29+
setVersion(value);
30+
window.location.href = DOMAINS[value];
31+
};
32+
33+
// Show skeleton while not mounted
34+
if (!mounted) {
35+
return (
36+
<Skeleton className="h-7 w-14 rounded-full border border-muted-foreground/20" />
37+
);
38+
}
39+
40+
return (
41+
<DropdownMenu>
42+
<DropdownMenuTrigger className="flex h-7 w-14 cursor-pointer items-center justify-between rounded-full bg-muted py-1 pl-2 pr-0.5 text-sm font-medium text-muted-foreground">
43+
{version}
44+
<div className="flex size-5 items-center justify-center rounded-full border border-muted-foreground/20">
45+
<ChevronDownIcon className="size-4 opacity-50" />
46+
</div>
47+
</DropdownMenuTrigger>
48+
<DropdownMenuContent align="start" className="min-w-[120px]">
49+
<DropdownMenuItem
50+
onClick={() => handleVersionChange("v3")}
51+
className={cn(
52+
"flex justify-between",
53+
version === "v3" && "bg-muted text-primary"
54+
)}
55+
>
56+
Tailwind v3
57+
{version === "v3" && <CheckIcon className="ml-2 size-4" />}
58+
</DropdownMenuItem>
59+
<DropdownMenuItem
60+
onClick={() => handleVersionChange("v4")}
61+
className={cn(
62+
"flex justify-between",
63+
version === "v4" && "bg-muted text-primary"
64+
)}
65+
>
66+
Tailwind v4
67+
{version === "v4" && <CheckIcon className="ml-2 size-4" />}
68+
</DropdownMenuItem>
69+
</DropdownMenuContent>
70+
</DropdownMenu>
71+
);
72+
}

content/docs/components/android.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/android"
22+
npx shadcn@latest add "https://v3.magicui.design/r/android"
2323
```
2424

2525
</TabsContent>

content/docs/components/animated-beam.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ video: https://cdn.magicui.design/animated-beam.mp4
2020
<TabsContent value="cli">
2121

2222
```bash
23-
npx shadcn@latest add "https://magicui.design/r/animated-beam"
23+
npx shadcn@latest add "https://v3.magicui.design/r/animated-beam"
2424
```
2525

2626
</TabsContent>

content/docs/components/animated-circular-progress-bar.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/animated-circular-progress-bar"
22+
npx shadcn@latest add "https://v3.magicui.design/r/animated-circular-progress-bar"
2323
```
2424

2525
</TabsContent>

content/docs/components/animated-gradient-text.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ video: https://cdn.magicui.design/animated-gradient-text.mp4
2020
<TabsContent value="cli">
2121

2222
```bash
23-
npx shadcn@latest add "https://magicui.design/r/animated-gradient-text"
23+
npx shadcn@latest add "https://v3.magicui.design/r/animated-gradient-text"
2424
```
2525

2626
</TabsContent>

content/docs/components/animated-grid-pattern.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/animated-grid-pattern"
22+
npx shadcn@latest add "https://v3.magicui.design/r/animated-grid-pattern"
2323
```
2424

2525
</TabsContent>

content/docs/components/animated-list.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/animated-list"
22+
npx shadcn@latest add "https://v3.magicui.design/r/animated-list"
2323
```
2424

2525
</TabsContent>

content/docs/components/animated-shiny-text.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ video: https://cdn.magicui.design/animated-shiny-text.mp4
2020
<TabsContent value="cli">
2121

2222
```bash
23-
npx shadcn@latest add "https://magicui.design/r/animated-shiny-text"
23+
npx shadcn@latest add "https://v3.magicui.design/r/animated-shiny-text"
2424
```
2525

2626
</TabsContent>

content/docs/components/animated-subscribe-button.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/animated-subscribe-button"
22+
npx shadcn@latest add "https://v3.magicui.design/r/animated-subscribe-button"
2323
```
2424

2525
</TabsContent>

content/docs/components/aurora-text.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/aurora-text"
22+
npx shadcn@latest add "https://v3.magicui.design/r/aurora-text"
2323
```
2424

2525
</TabsContent>

content/docs/components/avatar-circles.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/avatar-circles"
22+
npx shadcn@latest add "https://v3.magicui.design/r/avatar-circles"
2323
```
2424

2525
</TabsContent>

content/docs/components/bento-grid.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/bento-grid"
22+
npx shadcn@latest add "https://v3.magicui.design/r/bento-grid"
2323
```
2424

2525
</TabsContent>

content/docs/components/blur-fade.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/blur-fade"
22+
npx shadcn@latest add "https://v3.magicui.design/r/blur-fade"
2323
```
2424

2525
</TabsContent>

content/docs/components/border-beam.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ video: https://cdn.magicui.design/border-beam.mp4
2020
<TabsContent value="cli">
2121

2222
```bash
23-
npx shadcn@latest add "https://magicui.design/r/border-beam"
23+
npx shadcn@latest add "https://v3.magicui.design/r/border-beam"
2424
```
2525

2626
</TabsContent>

content/docs/components/box-reveal.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/box-reveal"
22+
npx shadcn@latest add "https://v3.magicui.design/r/box-reveal"
2323
```
2424

2525
</TabsContent>

content/docs/components/code-comparison.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/code-comparison"
22+
npx shadcn@latest add "https://v3.magicui.design/r/code-comparison"
2323
```
2424

2525
</TabsContent>

content/docs/components/confetti.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/confetti"
22+
npx shadcn@latest add "https://v3.magicui.design/r/confetti"
2323
```
2424

2525
</TabsContent>

content/docs/components/cool-mode.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/cool-mode"
22+
npx shadcn@latest add "https://v3.magicui.design/r/cool-mode"
2323
```
2424

2525
</TabsContent>

content/docs/components/dock.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ video: https://cdn.magicui.design/dock.mp4
2020
<TabsContent value="cli">
2121

2222
```bash
23-
npx shadcn@latest add "https://magicui.design/r/dock"
23+
npx shadcn@latest add "https://v3.magicui.design/r/dock"
2424
```
2525

2626
</TabsContent>

content/docs/components/dot-pattern.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ video: https://cdn.magicui.design/dot-pattern.mp4
2020
<TabsContent value="cli">
2121

2222
```bash
23-
npx shadcn@latest add "https://magicui.design/r/dot-pattern"
23+
npx shadcn@latest add "https://v3.magicui.design/r/dot-pattern"
2424
```
2525

2626
</TabsContent>

content/docs/components/file-tree.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/file-tree"
22+
npx shadcn@latest add "https://v3.magicui.design/r/file-tree"
2323
```
2424

2525
</TabsContent>

content/docs/components/flickering-grid.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ published: true
1919
<TabsContent value="cli">
2020

2121
```bash
22-
npx shadcn@latest add "https://magicui.design/r/flickering-grid"
22+
npx shadcn@latest add "https://v3.magicui.design/r/flickering-grid"
2323
```
2424

2525
</TabsContent>

0 commit comments

Comments
 (0)