gitscope
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/components/ui/command.tsx · v0.5.5
Source
1 3d1a4b1 Mrdn 2y ago import * as React from "react"
2 3d1a4b1 Mrdn 2y ago import { type DialogProps } from "@radix-ui/react-dialog"
3 3d1a4b1 Mrdn 2y ago import { Command as CommandPrimitive } from "cmdk"
4 3d1a4b1 Mrdn 2y ago import { Search } from "lucide-react"
5 3d1a4b1 Mrdn 2y ago
6 3d1a4b1 Mrdn 2y ago import { cn } from "@marzneshin/utils"
7 3d1a4b1 Mrdn 2y ago import { Dialog, DialogContent } from "@marzneshin/components/ui/dialog"
8 3d1a4b1 Mrdn 2y ago
9 3d1a4b1 Mrdn 2y ago const Command = React.forwardRef<
10 3d1a4b1 Mrdn 2y ago React.ElementRef<typeof CommandPrimitive>,
11 3d1a4b1 Mrdn 2y ago React.ComponentPropsWithoutRef<typeof CommandPrimitive>
12 3d1a4b1 Mrdn 2y ago >(({ className, ...props }, ref) => (
13 3d1a4b1 Mrdn 2y ago <CommandPrimitive
14 3d1a4b1 Mrdn 2y ago ref={ref}
15 3d1a4b1 Mrdn 2y ago className={cn(
16 3d1a4b1 Mrdn 2y ago "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
17 3d1a4b1 Mrdn 2y ago className
18 3d1a4b1 Mrdn 2y ago )}
19 3d1a4b1 Mrdn 2y ago {...props}
20 3d1a4b1 Mrdn 2y ago />
21 3d1a4b1 Mrdn 2y ago ))
22 3d1a4b1 Mrdn 2y ago Command.displayName = CommandPrimitive.displayName
23 3d1a4b1 Mrdn 2y ago
24 3d1a4b1 Mrdn 2y ago interface CommandDialogProps extends DialogProps {}
25 3d1a4b1 Mrdn 2y ago
26 3d1a4b1 Mrdn 2y ago const CommandDialog = ({ children, ...props }: CommandDialogProps) => {
27 3d1a4b1 Mrdn 2y ago return (
28 3d1a4b1 Mrdn 2y ago <Dialog {...props}>
29 3d1a4b1 Mrdn 2y ago <DialogContent className="overflow-hidden p-0 shadow-lg">
30 3d1a4b1 Mrdn 2y ago <Command className="[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5">
31 3d1a4b1 Mrdn 2y ago {children}
32 3d1a4b1 Mrdn 2y ago </Command>
33 3d1a4b1 Mrdn 2y ago </DialogContent>
34 3d1a4b1 Mrdn 2y ago </Dialog>
35 3d1a4b1 Mrdn 2y ago )
36 3d1a4b1 Mrdn 2y ago }
37 3d1a4b1 Mrdn 2y ago
38 3d1a4b1 Mrdn 2y ago const CommandInput = React.forwardRef<
39 3d1a4b1 Mrdn 2y ago React.ElementRef<typeof CommandPrimitive.Input>,
40 3d1a4b1 Mrdn 2y ago React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>
41 3d1a4b1 Mrdn 2y ago >(({ className, ...props }, ref) => (
42 3d1a4b1 Mrdn 2y ago <div className="flex items-center border-b px-3" cmdk-input-wrapper="">
43 3d1a4b1 Mrdn 2y ago <Search className="mr-2 h-4 w-4 shrink-0 opacity-50" />
44 3d1a4b1 Mrdn 2y ago <CommandPrimitive.Input
45 3d1a4b1 Mrdn 2y ago ref={ref}
46 3d1a4b1 Mrdn 2y ago className={cn(
47 3d1a4b1 Mrdn 2y ago "flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
48 3d1a4b1 Mrdn 2y ago className
49 3d1a4b1 Mrdn 2y ago )}
50 3d1a4b1 Mrdn 2y ago {...props}
51 3d1a4b1 Mrdn 2y ago />
52 3d1a4b1 Mrdn 2y ago </div>
53 3d1a4b1 Mrdn 2y ago ))
54 3d1a4b1 Mrdn 2y ago
55 3d1a4b1 Mrdn 2y ago CommandInput.displayName = CommandPrimitive.Input.displayName
56 3d1a4b1 Mrdn 2y ago
57 3d1a4b1 Mrdn 2y ago const CommandList = React.forwardRef<
58 3d1a4b1 Mrdn 2y ago React.ElementRef<typeof CommandPrimitive.List>,
59 3d1a4b1 Mrdn 2y ago React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>
60 3d1a4b1 Mrdn 2y ago >(({ className, ...props }, ref) => (
61 3d1a4b1 Mrdn 2y ago <CommandPrimitive.List
62 3d1a4b1 Mrdn 2y ago ref={ref}
63 3d1a4b1 Mrdn 2y ago className={cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className)}
64 3d1a4b1 Mrdn 2y ago {...props}
65 3d1a4b1 Mrdn 2y ago />
66 3d1a4b1 Mrdn 2y ago ))
67 3d1a4b1 Mrdn 2y ago
68 3d1a4b1 Mrdn 2y ago CommandList.displayName = CommandPrimitive.List.displayName
69 3d1a4b1 Mrdn 2y ago
70 3d1a4b1 Mrdn 2y ago const CommandEmpty = React.forwardRef<
71 3d1a4b1 Mrdn 2y ago React.ElementRef<typeof CommandPrimitive.Empty>,
72 3d1a4b1 Mrdn 2y ago React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>
73 3d1a4b1 Mrdn 2y ago >((props, ref) => (
74 3d1a4b1 Mrdn 2y ago <CommandPrimitive.Empty
75 3d1a4b1 Mrdn 2y ago ref={ref}
76 3d1a4b1 Mrdn 2y ago className="py-6 text-center text-sm"
77 3d1a4b1 Mrdn 2y ago {...props}
78 3d1a4b1 Mrdn 2y ago />
79 3d1a4b1 Mrdn 2y ago ))
80 3d1a4b1 Mrdn 2y ago
81 3d1a4b1 Mrdn 2y ago CommandEmpty.displayName = CommandPrimitive.Empty.displayName
82 3d1a4b1 Mrdn 2y ago
83 3d1a4b1 Mrdn 2y ago const CommandGroup = React.forwardRef<
84 3d1a4b1 Mrdn 2y ago React.ElementRef<typeof CommandPrimitive.Group>,
85 3d1a4b1 Mrdn 2y ago React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>
86 3d1a4b1 Mrdn 2y ago >(({ className, ...props }, ref) => (
87 3d1a4b1 Mrdn 2y ago <CommandPrimitive.Group
88 3d1a4b1 Mrdn 2y ago ref={ref}
89 3d1a4b1 Mrdn 2y ago className={cn(
90 3d1a4b1 Mrdn 2y ago "overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground",
91 3d1a4b1 Mrdn 2y ago className
92 3d1a4b1 Mrdn 2y ago )}
93 3d1a4b1 Mrdn 2y ago {...props}
94 3d1a4b1 Mrdn 2y ago />
95 3d1a4b1 Mrdn 2y ago ))
96 3d1a4b1 Mrdn 2y ago
97 3d1a4b1 Mrdn 2y ago CommandGroup.displayName = CommandPrimitive.Group.displayName
98 3d1a4b1 Mrdn 2y ago
99 3d1a4b1 Mrdn 2y ago const CommandSeparator = React.forwardRef<
100 3d1a4b1 Mrdn 2y ago React.ElementRef<typeof CommandPrimitive.Separator>,
101 3d1a4b1 Mrdn 2y ago React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>
102 3d1a4b1 Mrdn 2y ago >(({ className, ...props }, ref) => (
103 3d1a4b1 Mrdn 2y ago <CommandPrimitive.Separator
104 3d1a4b1 Mrdn 2y ago ref={ref}
105 3d1a4b1 Mrdn 2y ago className={cn("-mx-1 h-px bg-border", className)}
106 3d1a4b1 Mrdn 2y ago {...props}
107 3d1a4b1 Mrdn 2y ago />
108 3d1a4b1 Mrdn 2y ago ))
109 3d1a4b1 Mrdn 2y ago CommandSeparator.displayName = CommandPrimitive.Separator.displayName
110 3d1a4b1 Mrdn 2y ago
111 3d1a4b1 Mrdn 2y ago const CommandItem = React.forwardRef<
112 3d1a4b1 Mrdn 2y ago React.ElementRef<typeof CommandPrimitive.Item>,
113 3d1a4b1 Mrdn 2y ago React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>
114 3d1a4b1 Mrdn 2y ago >(({ className, ...props }, ref) => (
115 3d1a4b1 Mrdn 2y ago <CommandPrimitive.Item
116 3d1a4b1 Mrdn 2y ago ref={ref}
117 3d1a4b1 Mrdn 2y ago className={cn(
118 3d1a4b1 Mrdn 2y ago "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
119 3d1a4b1 Mrdn 2y ago className
120 3d1a4b1 Mrdn 2y ago )}
121 3d1a4b1 Mrdn 2y ago {...props}
122 3d1a4b1 Mrdn 2y ago />
123 3d1a4b1 Mrdn 2y ago ))
124 3d1a4b1 Mrdn 2y ago
125 3d1a4b1 Mrdn 2y ago CommandItem.displayName = CommandPrimitive.Item.displayName
126 3d1a4b1 Mrdn 2y ago
127 3d1a4b1 Mrdn 2y ago const CommandShortcut = ({
128 3d1a4b1 Mrdn 2y ago className,
129 3d1a4b1 Mrdn 2y ago ...props
130 3d1a4b1 Mrdn 2y ago }: React.HTMLAttributes<HTMLSpanElement>) => {
131 3d1a4b1 Mrdn 2y ago return (
132 3d1a4b1 Mrdn 2y ago <span
133 3d1a4b1 Mrdn 2y ago className={cn(
134 3d1a4b1 Mrdn 2y ago "ml-auto text-xs tracking-widest text-muted-foreground",
135 3d1a4b1 Mrdn 2y ago className
136 3d1a4b1 Mrdn 2y ago )}
137 3d1a4b1 Mrdn 2y ago {...props}
138 3d1a4b1 Mrdn 2y ago />
139 3d1a4b1 Mrdn 2y ago )
140 3d1a4b1 Mrdn 2y ago }
141 3d1a4b1 Mrdn 2y ago CommandShortcut.displayName = "CommandShortcut"
142 3d1a4b1 Mrdn 2y ago
143 3d1a4b1 Mrdn 2y ago export {
144 3d1a4b1 Mrdn 2y ago Command,
145 3d1a4b1 Mrdn 2y ago CommandDialog,
146 3d1a4b1 Mrdn 2y ago CommandInput,
147 3d1a4b1 Mrdn 2y ago CommandList,
148 3d1a4b1 Mrdn 2y ago CommandEmpty,
149 3d1a4b1 Mrdn 2y ago CommandGroup,
150 3d1a4b1 Mrdn 2y ago CommandItem,
151 3d1a4b1 Mrdn 2y ago CommandShortcut,
152 3d1a4b1 Mrdn 2y ago CommandSeparator,
153 3d1a4b1 Mrdn 2y ago }