Skip to content
116 linesCodeBlameRaw

Pick any line to see why it is the way it is: the commit, the pull request and issue it came from, and what the agent was thinking.

One kind of access token; presence and status; usernames keep their case; the tour is a miniature of the real app; icons for password managers1import { ChevronRight } from "lucide-react";
g1t agents: model menu and optional AI Gateway routing2import { DropdownMenu as Primitive } from "radix-ui";
3import type { ComponentProps } from "react";
4
5import { cn } from "../../lib/cn";
6
7// shadcn/ui's dropdown menu, styled with g1t's tokens.
8
9export const DropdownMenu = Primitive.Root;
10export const DropdownMenuTrigger = Primitive.Trigger;
11export const DropdownMenuGroup = Primitive.Group;
12
13export function DropdownMenuContent({
14 className,
15 sideOffset = 6,
16 ...props
17}: ComponentProps<typeof Primitive.Content>) {
18 return (
19 <Primitive.Portal>
20 <Primitive.Content
21 sideOffset={sideOffset}
22 className={cn(
23 "z-50 min-w-48 origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-lg border border-line-strong bg-raised p-1 text-sm shadow-xl shadow-black/40",
Workspace names and icons, and a component kit for every control24 "data-[state=open]:animate-pop-in data-[state=closed]:animate-pop-out motion-reduce:animate-none",
g1t agents: model menu and optional AI Gateway routing25 className,
26 )}
27 {...props}
28 />
29 </Primitive.Portal>
30 );
31}
32
33export function DropdownMenuItem({
34 className,
35 ...props
36}: ComponentProps<typeof Primitive.Item>) {
37 return (
38 <Primitive.Item
39 className={cn(
40 "flex cursor-default items-center gap-2 rounded-md px-2 py-1.5 text-fg/90 outline-none select-none",
41 "data-highlighted:bg-line data-highlighted:text-fg data-disabled:opacity-50",
42 "[&_svg]:size-4 [&_svg]:shrink-0 [&_svg]:text-faint",
43 className,
44 )}
45 {...props}
46 />
47 );
48}
49
50export function DropdownMenuLabel({
51 className,
52 ...props
53}: ComponentProps<typeof Primitive.Label>) {
54 return (
55 <Primitive.Label
56 className={cn("px-2 py-1.5 text-xs text-faint", className)}
57 {...props}
58 />
59 );
60}
61
62export function DropdownMenuSeparator({
63 className,
64 ...props
65}: ComponentProps<typeof Primitive.Separator>) {
66 return (
67 <Primitive.Separator
68 className={cn("-mx-1 my-1 h-px bg-line", className)}
69 {...props}
70 />
71 );
72}
One kind of access token; presence and status; usernames keep their case; the tour is a miniature of the real app; icons for password managers73
74export const DropdownMenuSub = Primitive.Sub;
75
76/** A row that opens a submenu beside it, with a chevron at its end. */
77export function DropdownMenuSubTrigger({
78 className,
79 children,
80 ...props
81}: ComponentProps<typeof Primitive.SubTrigger>) {
82 return (
83 <Primitive.SubTrigger
84 className={cn(
85 "flex cursor-default items-center gap-2 rounded-md px-2 py-1.5 text-fg/90 outline-none select-none",
86 "data-highlighted:bg-line data-highlighted:text-fg data-[state=open]:bg-line data-[state=open]:text-fg data-disabled:opacity-50",
87 "[&_svg]:size-4 [&_svg]:shrink-0 [&_svg]:text-faint",
88 className,
89 )}
90 {...props}
91 >
92 {children}
93 <ChevronRight className="ml-auto" />
94 </Primitive.SubTrigger>
95 );
96}
97
98export function DropdownMenuSubContent({
99 className,
100 sideOffset = 6,
101 ...props
102}: ComponentProps<typeof Primitive.SubContent>) {
103 return (
104 <Primitive.Portal>
105 <Primitive.SubContent
106 sideOffset={sideOffset}
107 className={cn(
108 "z-50 min-w-44 origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-lg border border-line-strong bg-raised p-1 text-sm shadow-xl shadow-black/40",
109 "data-[state=open]:animate-pop-in data-[state=closed]:animate-pop-out motion-reduce:animate-none",
110 className,
111 )}
112 {...props}
113 />
114 </Primitive.Portal>
115 );
116}

This file's history is long; its oldest lines are credited to the oldest commit read.