@codefast/ui 0.0.66 → 0.0.67
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/styles.css +1 -1
- package/dist/styles.css.map +1 -1
- package/package.json +70 -102
- package/dist/chunk-DH3YP4ZC.cjs +0 -2
- package/dist/chunk-DH3YP4ZC.cjs.map +0 -1
- package/dist/chunk-DTSAQICV.js +0 -2
- package/dist/chunk-DTSAQICV.js.map +0 -1
- package/dist/chunk-NH6X3FON.js +0 -2
- package/dist/chunk-NH6X3FON.js.map +0 -1
- package/dist/chunk-P563ILDJ.cjs +0 -2
- package/dist/chunk-P563ILDJ.cjs.map +0 -1
- package/dist/chunk-VVA2EE5V.js +0 -2
- package/dist/chunk-VVA2EE5V.js.map +0 -1
- package/dist/chunk-VZ6P3BCB.cjs +0 -2
- package/dist/chunk-VZ6P3BCB.cjs.map +0 -1
- package/dist/hooks/use-media-query.cjs +0 -2
- package/dist/hooks/use-media-query.cjs.map +0 -1
- package/dist/hooks/use-media-query.d.cts +0 -3
- package/dist/hooks/use-media-query.d.ts +0 -3
- package/dist/hooks/use-media-query.js +0 -2
- package/dist/hooks/use-media-query.js.map +0 -1
- package/dist/hooks/use-mutation-observer.cjs +0 -2
- package/dist/hooks/use-mutation-observer.cjs.map +0 -1
- package/dist/hooks/use-mutation-observer.d.cts +0 -5
- package/dist/hooks/use-mutation-observer.d.ts +0 -5
- package/dist/hooks/use-mutation-observer.js +0 -2
- package/dist/hooks/use-mutation-observer.js.map +0 -1
- package/dist/lib/colors.cjs +0 -2
- package/dist/lib/colors.cjs.map +0 -1
- package/dist/lib/colors.d.cts +0 -1759
- package/dist/lib/colors.d.ts +0 -1759
- package/dist/lib/colors.js +0 -2
- package/dist/lib/colors.js.map +0 -1
- package/dist/plugin/animate.plugin.cjs +0 -2
- package/dist/plugin/animate.plugin.cjs.map +0 -1
- package/dist/plugin/animate.plugin.js +0 -2
- package/dist/plugin/animate.plugin.js.map +0 -1
- package/dist/plugin/base.plugin.cjs +0 -2
- package/dist/plugin/base.plugin.cjs.map +0 -1
- package/dist/plugin/base.plugin.js +0 -2
- package/dist/plugin/base.plugin.js.map +0 -1
- package/dist/plugin/perspective.plugin.cjs +0 -2
- package/dist/plugin/perspective.plugin.cjs.map +0 -1
- package/dist/plugin/perspective.plugin.js +0 -2
- package/dist/plugin/perspective.plugin.js.map +0 -1
- package/dist/tailwind.config.cjs +0 -2
- package/dist/tailwind.config.cjs.map +0 -1
- package/dist/tailwind.config.js +0 -2
- package/dist/tailwind.config.js.map +0 -1
- package/plugin/animate.plugin.ts +0 -319
- package/plugin/base.plugin.ts +0 -21
- package/plugin/perspective.plugin.ts +0 -11
- package/src/hooks/use-media-query.ts +0 -22
- package/src/hooks/use-mutation-observer.ts +0 -26
- package/src/lib/colors.ts +0 -1757
- package/src/lib/utils.ts +0 -6
- package/src/react/accordion.tsx +0 -88
- package/src/react/alert-dialog.tsx +0 -185
- package/src/react/alert.tsx +0 -73
- package/src/react/aspect-ratio.tsx +0 -17
- package/src/react/avatar.tsx +0 -60
- package/src/react/badge.tsx +0 -39
- package/src/react/blockquote.tsx +0 -26
- package/src/react/box.tsx +0 -34
- package/src/react/breadcrumb.tsx +0 -154
- package/src/react/button.tsx +0 -94
- package/src/react/calendar.tsx +0 -79
- package/src/react/card.tsx +0 -109
- package/src/react/carousel.tsx +0 -299
- package/src/react/checkbox-cards.tsx +0 -61
- package/src/react/checkbox-group.primitive.tsx +0 -206
- package/src/react/checkbox-group.tsx +0 -55
- package/src/react/checkbox.tsx +0 -36
- package/src/react/code.tsx +0 -26
- package/src/react/collapsible.tsx +0 -54
- package/src/react/command.tsx +0 -209
- package/src/react/container.tsx +0 -29
- package/src/react/context-menu.tsx +0 -306
- package/src/react/data-table.tsx +0 -249
- package/src/react/dialog.tsx +0 -160
- package/src/react/drawer.tsx +0 -136
- package/src/react/dropdown-menu.tsx +0 -290
- package/src/react/em.tsx +0 -26
- package/src/react/form.tsx +0 -234
- package/src/react/heading.tsx +0 -29
- package/src/react/hover-card.tsx +0 -75
- package/src/react/input-otp.tsx +0 -120
- package/src/react/input.tsx +0 -145
- package/src/react/kbd.tsx +0 -36
- package/src/react/label.tsx +0 -31
- package/src/react/menubar.tsx +0 -322
- package/src/react/navigation-menu.tsx +0 -192
- package/src/react/pagination.tsx +0 -150
- package/src/react/popover.tsx +0 -84
- package/src/react/pre.tsx +0 -26
- package/src/react/progress.tsx +0 -35
- package/src/react/quote.tsx +0 -26
- package/src/react/radio-cards.tsx +0 -48
- package/src/react/radio-group.tsx +0 -50
- package/src/react/radio.tsx +0 -40
- package/src/react/resizable.tsx +0 -62
- package/src/react/scroll-area.tsx +0 -106
- package/src/react/section.tsx +0 -26
- package/src/react/select.tsx +0 -219
- package/src/react/separator.tsx +0 -32
- package/src/react/sheet.tsx +0 -178
- package/src/react/skeleton.tsx +0 -18
- package/src/react/slider.tsx +0 -41
- package/src/react/sonner.tsx +0 -40
- package/src/react/spinner.tsx +0 -68
- package/src/react/strong.tsx +0 -26
- package/src/react/switch.tsx +0 -33
- package/src/react/table.tsx +0 -148
- package/src/react/tabs.tsx +0 -87
- package/src/react/text-input.tsx +0 -36
- package/src/react/text.tsx +0 -34
- package/src/react/textarea.tsx +0 -30
- package/src/react/toggle-group.tsx +0 -84
- package/src/react/toggle.tsx +0 -49
- package/src/react/tooltip.tsx +0 -83
- package/src/styles/styles.css +0 -3
- package/tailwind.config.ts +0 -126
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
|
|
3
|
-
import * as React from 'react';
|
|
4
|
-
import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
|
|
5
|
-
import { cn } from '../lib/utils';
|
|
6
|
-
|
|
7
|
-
/* -----------------------------------------------------------------------------
|
|
8
|
-
* Component: Collapsible
|
|
9
|
-
* -------------------------------------------------------------------------- */
|
|
10
|
-
|
|
11
|
-
type CollapsibleProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>;
|
|
12
|
-
const Collapsible = CollapsiblePrimitive.Root;
|
|
13
|
-
|
|
14
|
-
/* -----------------------------------------------------------------------------
|
|
15
|
-
* Component: CollapsibleTrigger
|
|
16
|
-
* -------------------------------------------------------------------------- */
|
|
17
|
-
|
|
18
|
-
type CollapsibleTriggerProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.CollapsibleTrigger>;
|
|
19
|
-
const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger;
|
|
20
|
-
|
|
21
|
-
/* -----------------------------------------------------------------------------
|
|
22
|
-
* Component: CollapsibleContent
|
|
23
|
-
* -------------------------------------------------------------------------- */
|
|
24
|
-
|
|
25
|
-
type CollapsibleContentElement = React.ElementRef<typeof CollapsiblePrimitive.CollapsibleContent>;
|
|
26
|
-
type CollapsibleContentProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.CollapsibleContent>;
|
|
27
|
-
|
|
28
|
-
const CollapsibleContent = React.forwardRef<CollapsibleContentElement, CollapsibleContentProps>(
|
|
29
|
-
({ className, ...props }, forwardedRef) => (
|
|
30
|
-
<CollapsiblePrimitive.CollapsibleContent
|
|
31
|
-
ref={forwardedRef}
|
|
32
|
-
className={cn(
|
|
33
|
-
'data-[state=open]:animate-collapsible-open data-[state=closed]:animate-collapsible-closed overflow-hidden',
|
|
34
|
-
className,
|
|
35
|
-
)}
|
|
36
|
-
{...props}
|
|
37
|
-
/>
|
|
38
|
-
),
|
|
39
|
-
);
|
|
40
|
-
|
|
41
|
-
CollapsibleContent.displayName = CollapsiblePrimitive.CollapsibleContent.displayName;
|
|
42
|
-
|
|
43
|
-
/* -----------------------------------------------------------------------------
|
|
44
|
-
* Exports
|
|
45
|
-
* -------------------------------------------------------------------------- */
|
|
46
|
-
|
|
47
|
-
export {
|
|
48
|
-
Collapsible,
|
|
49
|
-
CollapsibleTrigger,
|
|
50
|
-
CollapsibleContent,
|
|
51
|
-
type CollapsibleProps,
|
|
52
|
-
type CollapsibleTriggerProps,
|
|
53
|
-
type CollapsibleContentProps,
|
|
54
|
-
};
|
package/src/react/command.tsx
DELETED
|
@@ -1,209 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
|
|
3
|
-
import * as React from 'react';
|
|
4
|
-
import { MagnifyingGlassIcon } from '@radix-ui/react-icons';
|
|
5
|
-
import { Command as CommandPrimitive } from 'cmdk';
|
|
6
|
-
import { cn } from '../lib/utils';
|
|
7
|
-
import { Dialog, DialogContent } from './dialog';
|
|
8
|
-
|
|
9
|
-
/* -----------------------------------------------------------------------------
|
|
10
|
-
* Component: Command
|
|
11
|
-
* -------------------------------------------------------------------------- */
|
|
12
|
-
|
|
13
|
-
type CommandElement = React.ElementRef<typeof CommandPrimitive>;
|
|
14
|
-
type CommandProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive>;
|
|
15
|
-
|
|
16
|
-
const Command = React.forwardRef<CommandElement, CommandProps>(({ className, ...props }, forwardedRef) => (
|
|
17
|
-
<CommandPrimitive
|
|
18
|
-
ref={forwardedRef}
|
|
19
|
-
className={cn(
|
|
20
|
-
'bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md',
|
|
21
|
-
className,
|
|
22
|
-
)}
|
|
23
|
-
{...props}
|
|
24
|
-
/>
|
|
25
|
-
));
|
|
26
|
-
|
|
27
|
-
Command.displayName = CommandPrimitive.displayName;
|
|
28
|
-
|
|
29
|
-
/* -----------------------------------------------------------------------------
|
|
30
|
-
* Component: CommandDialog
|
|
31
|
-
* -------------------------------------------------------------------------- */
|
|
32
|
-
|
|
33
|
-
type CommandDialogProps = React.ComponentProps<typeof Dialog>;
|
|
34
|
-
|
|
35
|
-
function CommandDialog({ children, ...props }: CommandDialogProps): React.JSX.Element {
|
|
36
|
-
return (
|
|
37
|
-
<Dialog {...props}>
|
|
38
|
-
<DialogContent className="p-0">
|
|
39
|
-
<Command className="[&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:size-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:size-5">
|
|
40
|
-
{children}
|
|
41
|
-
</Command>
|
|
42
|
-
</DialogContent>
|
|
43
|
-
</Dialog>
|
|
44
|
-
);
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
/* -----------------------------------------------------------------------------
|
|
48
|
-
* Component: CommandInput
|
|
49
|
-
* -------------------------------------------------------------------------- */
|
|
50
|
-
|
|
51
|
-
type CommandInputElement = React.ElementRef<typeof CommandPrimitive.Input>;
|
|
52
|
-
type CommandInputProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>;
|
|
53
|
-
|
|
54
|
-
const CommandInput = React.forwardRef<CommandInputElement, CommandInputProps>(
|
|
55
|
-
({ className, ...props }, forwardedRef) => (
|
|
56
|
-
<div className="flex items-center gap-2 border-b px-3" cmdk-input-wrapper="">
|
|
57
|
-
<MagnifyingGlassIcon className="size-5 shrink-0 opacity-50" />
|
|
58
|
-
<CommandPrimitive.Input
|
|
59
|
-
ref={forwardedRef}
|
|
60
|
-
className={cn(
|
|
61
|
-
'placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent text-sm outline-none disabled:cursor-default disabled:opacity-50',
|
|
62
|
-
className,
|
|
63
|
-
)}
|
|
64
|
-
{...props}
|
|
65
|
-
/>
|
|
66
|
-
</div>
|
|
67
|
-
),
|
|
68
|
-
);
|
|
69
|
-
|
|
70
|
-
CommandInput.displayName = CommandPrimitive.Input.displayName;
|
|
71
|
-
|
|
72
|
-
/* -----------------------------------------------------------------------------
|
|
73
|
-
* Component: CommandList
|
|
74
|
-
* -------------------------------------------------------------------------- */
|
|
75
|
-
|
|
76
|
-
type CommandListElement = React.ElementRef<typeof CommandPrimitive.List>;
|
|
77
|
-
type CommandListProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>;
|
|
78
|
-
|
|
79
|
-
const CommandList = React.forwardRef<CommandListElement, CommandListProps>(({ className, ...props }, forwardedRef) => (
|
|
80
|
-
<CommandPrimitive.List
|
|
81
|
-
ref={forwardedRef}
|
|
82
|
-
className={cn('max-h-72 overflow-y-auto overflow-x-hidden', className)}
|
|
83
|
-
{...props}
|
|
84
|
-
/>
|
|
85
|
-
));
|
|
86
|
-
|
|
87
|
-
CommandList.displayName = CommandPrimitive.List.displayName;
|
|
88
|
-
|
|
89
|
-
/* -----------------------------------------------------------------------------
|
|
90
|
-
* Component: CommandEmpty
|
|
91
|
-
* -------------------------------------------------------------------------- */
|
|
92
|
-
|
|
93
|
-
type CommandEmptyElement = React.ElementRef<typeof CommandPrimitive.Empty>;
|
|
94
|
-
type CommandEmptyProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>;
|
|
95
|
-
|
|
96
|
-
const CommandEmpty = React.forwardRef<CommandEmptyElement, CommandEmptyProps>((props, forwardedRef) => (
|
|
97
|
-
<CommandPrimitive.Empty ref={forwardedRef} className="py-6 text-center text-sm" {...props} />
|
|
98
|
-
));
|
|
99
|
-
|
|
100
|
-
CommandEmpty.displayName = CommandPrimitive.Empty.displayName;
|
|
101
|
-
|
|
102
|
-
/* -----------------------------------------------------------------------------
|
|
103
|
-
* Component: CommandGroup
|
|
104
|
-
* -------------------------------------------------------------------------- */
|
|
105
|
-
|
|
106
|
-
type CommandGroupElement = React.ElementRef<typeof CommandPrimitive.Group>;
|
|
107
|
-
type CommandGroupProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>;
|
|
108
|
-
|
|
109
|
-
const CommandGroup = React.forwardRef<CommandGroupElement, CommandGroupProps>(
|
|
110
|
-
({ className, ...props }, forwardedRef) => (
|
|
111
|
-
<CommandPrimitive.Group
|
|
112
|
-
ref={forwardedRef}
|
|
113
|
-
className={cn(
|
|
114
|
-
'text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium',
|
|
115
|
-
className,
|
|
116
|
-
)}
|
|
117
|
-
{...props}
|
|
118
|
-
/>
|
|
119
|
-
),
|
|
120
|
-
);
|
|
121
|
-
|
|
122
|
-
CommandGroup.displayName = CommandPrimitive.Group.displayName;
|
|
123
|
-
|
|
124
|
-
/* -----------------------------------------------------------------------------
|
|
125
|
-
* Component: CommandSeparator
|
|
126
|
-
* -------------------------------------------------------------------------- */
|
|
127
|
-
|
|
128
|
-
type CommandSeparatorElement = React.ElementRef<typeof CommandPrimitive.Separator>;
|
|
129
|
-
type CommandSeparatorProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>;
|
|
130
|
-
|
|
131
|
-
const CommandSeparator = React.forwardRef<CommandSeparatorElement, CommandSeparatorProps>(
|
|
132
|
-
({ className, ...props }, forwardedRef) => (
|
|
133
|
-
<CommandPrimitive.Separator ref={forwardedRef} className={cn('bg-border -mx-1 h-px', className)} {...props} />
|
|
134
|
-
),
|
|
135
|
-
);
|
|
136
|
-
|
|
137
|
-
CommandSeparator.displayName = CommandPrimitive.Separator.displayName;
|
|
138
|
-
|
|
139
|
-
/* -----------------------------------------------------------------------------
|
|
140
|
-
* Component: CommandItem
|
|
141
|
-
* -------------------------------------------------------------------------- */
|
|
142
|
-
|
|
143
|
-
type CommandItemElement = React.ElementRef<typeof CommandPrimitive.Item>;
|
|
144
|
-
type CommandItemProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>;
|
|
145
|
-
|
|
146
|
-
const CommandItem = React.forwardRef<CommandItemElement, CommandItemProps>(({ className, ...props }, forwardedRef) => (
|
|
147
|
-
<CommandPrimitive.Item
|
|
148
|
-
ref={forwardedRef}
|
|
149
|
-
className={cn(
|
|
150
|
-
'aria-selected:bg-accent aria-selected:text-accent-foreground relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-selected:outline-none',
|
|
151
|
-
className,
|
|
152
|
-
)}
|
|
153
|
-
{...props}
|
|
154
|
-
/>
|
|
155
|
-
));
|
|
156
|
-
|
|
157
|
-
CommandItem.displayName = CommandPrimitive.Item.displayName;
|
|
158
|
-
|
|
159
|
-
/* -----------------------------------------------------------------------------
|
|
160
|
-
* Component: CommandLoading
|
|
161
|
-
* -------------------------------------------------------------------------- */
|
|
162
|
-
|
|
163
|
-
type CommandLoadingElement = React.ElementRef<typeof CommandPrimitive.Loading>;
|
|
164
|
-
type CommandLoadingProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Loading>;
|
|
165
|
-
|
|
166
|
-
const CommandLoading = React.forwardRef<CommandLoadingElement, CommandLoadingProps>(
|
|
167
|
-
({ className, ...props }, forwardedRef) => (
|
|
168
|
-
<CommandPrimitive.Loading ref={forwardedRef} className={cn('flex justify-center p-2', className)} {...props} />
|
|
169
|
-
),
|
|
170
|
-
);
|
|
171
|
-
|
|
172
|
-
CommandLoading.displayName = CommandPrimitive.Loading.displayName;
|
|
173
|
-
|
|
174
|
-
/* -----------------------------------------------------------------------------
|
|
175
|
-
* Component: CommandShortcut
|
|
176
|
-
* -------------------------------------------------------------------------- */
|
|
177
|
-
|
|
178
|
-
type CommandShortcutProps = React.HTMLAttributes<HTMLSpanElement>;
|
|
179
|
-
|
|
180
|
-
function CommandShortcut({ className, ...props }: CommandShortcutProps): React.JSX.Element {
|
|
181
|
-
return <span className={cn('text-muted-foreground ml-auto text-xs tracking-widest', className)} {...props} />;
|
|
182
|
-
}
|
|
183
|
-
|
|
184
|
-
/* -----------------------------------------------------------------------------
|
|
185
|
-
* Exports
|
|
186
|
-
* -------------------------------------------------------------------------- */
|
|
187
|
-
|
|
188
|
-
export {
|
|
189
|
-
Command,
|
|
190
|
-
CommandDialog,
|
|
191
|
-
CommandInput,
|
|
192
|
-
CommandList,
|
|
193
|
-
CommandEmpty,
|
|
194
|
-
CommandGroup,
|
|
195
|
-
CommandItem,
|
|
196
|
-
CommandLoading,
|
|
197
|
-
CommandShortcut,
|
|
198
|
-
CommandSeparator,
|
|
199
|
-
type CommandProps,
|
|
200
|
-
type CommandDialogProps,
|
|
201
|
-
type CommandInputProps,
|
|
202
|
-
type CommandListProps,
|
|
203
|
-
type CommandEmptyProps,
|
|
204
|
-
type CommandGroupProps,
|
|
205
|
-
type CommandItemProps,
|
|
206
|
-
type CommandLoadingProps,
|
|
207
|
-
type CommandShortcutProps,
|
|
208
|
-
type CommandSeparatorProps,
|
|
209
|
-
};
|
package/src/react/container.tsx
DELETED
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { Slot } from '@radix-ui/react-slot';
|
|
3
|
-
import { cn } from '../lib/utils';
|
|
4
|
-
|
|
5
|
-
/* -----------------------------------------------------------------------------
|
|
6
|
-
* Component: Container
|
|
7
|
-
* -------------------------------------------------------------------------- */
|
|
8
|
-
|
|
9
|
-
type ContainerElement = HTMLDivElement;
|
|
10
|
-
|
|
11
|
-
interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
12
|
-
asChild?: boolean;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
const Container = React.forwardRef<ContainerElement, ContainerProps>(
|
|
16
|
-
({ className, asChild, ...props }, forwardedRef) => {
|
|
17
|
-
const Component = asChild ? Slot : 'div';
|
|
18
|
-
|
|
19
|
-
return <Component ref={forwardedRef} className={cn('container', className)} {...props} />;
|
|
20
|
-
},
|
|
21
|
-
);
|
|
22
|
-
|
|
23
|
-
Container.displayName = 'Container';
|
|
24
|
-
|
|
25
|
-
/* -----------------------------------------------------------------------------
|
|
26
|
-
* Exports
|
|
27
|
-
* -------------------------------------------------------------------------- */
|
|
28
|
-
|
|
29
|
-
export { Container, type ContainerProps };
|
|
@@ -1,306 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
|
|
3
|
-
import * as React from 'react';
|
|
4
|
-
import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
|
|
5
|
-
import { CheckIcon, ChevronRightIcon, DotFilledIcon } from '@radix-ui/react-icons';
|
|
6
|
-
import { cn } from '../lib/utils';
|
|
7
|
-
|
|
8
|
-
/* -----------------------------------------------------------------------------
|
|
9
|
-
* Component: ContextMenu
|
|
10
|
-
* -------------------------------------------------------------------------- */
|
|
11
|
-
|
|
12
|
-
type ContextMenuProps = React.ComponentProps<typeof ContextMenuPrimitive.Root>;
|
|
13
|
-
const ContextMenu = ContextMenuPrimitive.Root;
|
|
14
|
-
|
|
15
|
-
/* -----------------------------------------------------------------------------
|
|
16
|
-
* Component: ContextMenuTrigger
|
|
17
|
-
* -------------------------------------------------------------------------- */
|
|
18
|
-
|
|
19
|
-
type ContextMenuTriggerProps = React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Trigger>;
|
|
20
|
-
const ContextMenuTrigger = ContextMenuPrimitive.Trigger;
|
|
21
|
-
|
|
22
|
-
/* -----------------------------------------------------------------------------
|
|
23
|
-
* Component: ContextMenuGroup
|
|
24
|
-
* -------------------------------------------------------------------------- */
|
|
25
|
-
|
|
26
|
-
type ContextMenuGroupProps = React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Group>;
|
|
27
|
-
const ContextMenuGroup = ContextMenuPrimitive.Group;
|
|
28
|
-
|
|
29
|
-
/* -----------------------------------------------------------------------------
|
|
30
|
-
* Component: ContextMenuSub
|
|
31
|
-
* -------------------------------------------------------------------------- */
|
|
32
|
-
|
|
33
|
-
type ContextMenuSubProps = React.ComponentProps<typeof ContextMenuPrimitive.Sub>;
|
|
34
|
-
const ContextMenuSub = ContextMenuPrimitive.Sub;
|
|
35
|
-
|
|
36
|
-
/* -----------------------------------------------------------------------------
|
|
37
|
-
* Component: ContextMenuRadioGroup
|
|
38
|
-
* -------------------------------------------------------------------------- */
|
|
39
|
-
|
|
40
|
-
type ContextMenuRadioGroupProps = React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.RadioGroup>;
|
|
41
|
-
const ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
|
|
42
|
-
|
|
43
|
-
/* -----------------------------------------------------------------------------
|
|
44
|
-
* Component: ContextMenuSubTrigger
|
|
45
|
-
* -------------------------------------------------------------------------- */
|
|
46
|
-
|
|
47
|
-
type ContextMenuSubTriggerElement = React.ElementRef<typeof ContextMenuPrimitive.SubTrigger>;
|
|
48
|
-
|
|
49
|
-
interface ContextMenuSubTriggerProps extends React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.SubTrigger> {
|
|
50
|
-
inset?: boolean;
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
const ContextMenuSubTrigger = React.forwardRef<ContextMenuSubTriggerElement, ContextMenuSubTriggerProps>(
|
|
54
|
-
({ children, className, inset, ...props }, forwardedRef) => (
|
|
55
|
-
<ContextMenuPrimitive.SubTrigger
|
|
56
|
-
ref={forwardedRef}
|
|
57
|
-
className={cn(
|
|
58
|
-
'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm focus:outline-none',
|
|
59
|
-
inset && 'pl-8',
|
|
60
|
-
className,
|
|
61
|
-
)}
|
|
62
|
-
{...props}
|
|
63
|
-
>
|
|
64
|
-
{children}
|
|
65
|
-
<ChevronRightIcon className="ml-auto size-4" />
|
|
66
|
-
</ContextMenuPrimitive.SubTrigger>
|
|
67
|
-
),
|
|
68
|
-
);
|
|
69
|
-
|
|
70
|
-
ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;
|
|
71
|
-
|
|
72
|
-
/* -----------------------------------------------------------------------------
|
|
73
|
-
* Component: ContextMenuSubContent
|
|
74
|
-
* -------------------------------------------------------------------------- */
|
|
75
|
-
|
|
76
|
-
type ContextMenuSubContentElement = React.ElementRef<typeof ContextMenuPrimitive.SubContent>;
|
|
77
|
-
type ContextMenuSubContentProps = React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.SubContent>;
|
|
78
|
-
|
|
79
|
-
const ContextMenuSubContent = React.forwardRef<ContextMenuSubContentElement, ContextMenuSubContentProps>(
|
|
80
|
-
({ className, ...props }, forwardedRef) => (
|
|
81
|
-
<ContextMenuPrimitive.Portal>
|
|
82
|
-
<ContextMenuPrimitive.SubContent
|
|
83
|
-
ref={forwardedRef}
|
|
84
|
-
className={cn(
|
|
85
|
-
'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=open]:fade-in data-[state=open]:zoom-in-95 data-[state=open]:data-[side=top]:slide-in-from-bottom-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 data-[state=closed]:animate-out data-[state=closed]:fade-out data-[state=closed]:zoom-out-95 data-[state=closed]:data-[side=top]:slide-out-to-bottom-2 data-[state=closed]:data-[side=right]:slide-out-to-left-2 data-[state=closed]:data-[side=bottom]:slide-out-to-top-2 data-[state=closed]:data-[side=left]:slide-out-to-right-2 z-50 min-w-32 rounded-md border p-1 shadow-md',
|
|
86
|
-
className,
|
|
87
|
-
)}
|
|
88
|
-
{...props}
|
|
89
|
-
/>
|
|
90
|
-
</ContextMenuPrimitive.Portal>
|
|
91
|
-
),
|
|
92
|
-
);
|
|
93
|
-
|
|
94
|
-
ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
|
|
95
|
-
|
|
96
|
-
/* -----------------------------------------------------------------------------
|
|
97
|
-
* Component: ContextMenuContent
|
|
98
|
-
* -------------------------------------------------------------------------- */
|
|
99
|
-
|
|
100
|
-
type ContextMenuContentElement = React.ElementRef<typeof ContextMenuPrimitive.Content>;
|
|
101
|
-
type ContextMenuContentProps = React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Content>;
|
|
102
|
-
|
|
103
|
-
const ContextMenuContent = React.forwardRef<ContextMenuContentElement, ContextMenuContentProps>(
|
|
104
|
-
({ className, ...props }, forwardedRef) => (
|
|
105
|
-
<ContextMenuPrimitive.Portal>
|
|
106
|
-
<ContextMenuPrimitive.Content
|
|
107
|
-
ref={forwardedRef}
|
|
108
|
-
className={cn(
|
|
109
|
-
'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=open]:fade-in data-[state=open]:zoom-in-95 data-[state=open]:data-[side=top]:slide-in-from-bottom-2 data-[state=open]:data-[side=right]:slide-in-from-left-2 data-[state=open]:data-[side=bottom]:slide-in-from-top-2 data-[state=open]:data-[side=left]:slide-in-from-right-2 z-50 min-w-32 rounded-md border p-1 shadow-md',
|
|
110
|
-
className,
|
|
111
|
-
)}
|
|
112
|
-
{...props}
|
|
113
|
-
/>
|
|
114
|
-
</ContextMenuPrimitive.Portal>
|
|
115
|
-
),
|
|
116
|
-
);
|
|
117
|
-
|
|
118
|
-
ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;
|
|
119
|
-
|
|
120
|
-
/* -----------------------------------------------------------------------------
|
|
121
|
-
* Component: ContextMenuItem
|
|
122
|
-
* -------------------------------------------------------------------------- */
|
|
123
|
-
|
|
124
|
-
type ContextMenuItemElement = React.ElementRef<typeof ContextMenuPrimitive.Item>;
|
|
125
|
-
|
|
126
|
-
interface ContextMenuItemProps extends React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Item> {
|
|
127
|
-
inset?: boolean;
|
|
128
|
-
}
|
|
129
|
-
|
|
130
|
-
const ContextMenuItem = React.forwardRef<ContextMenuItemElement, ContextMenuItemProps>(
|
|
131
|
-
({ className, inset, ...props }, forwardedRef) => (
|
|
132
|
-
<ContextMenuPrimitive.Item
|
|
133
|
-
ref={forwardedRef}
|
|
134
|
-
className={cn(
|
|
135
|
-
'focus:bg-accent focus:text-accent-foreground relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm focus:outline-none aria-disabled:pointer-events-none aria-disabled:opacity-50',
|
|
136
|
-
inset && 'pl-8',
|
|
137
|
-
className,
|
|
138
|
-
)}
|
|
139
|
-
{...props}
|
|
140
|
-
/>
|
|
141
|
-
),
|
|
142
|
-
);
|
|
143
|
-
|
|
144
|
-
ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;
|
|
145
|
-
|
|
146
|
-
/* -----------------------------------------------------------------------------
|
|
147
|
-
* Component: ContextMenuCheckboxItem
|
|
148
|
-
* -------------------------------------------------------------------------- */
|
|
149
|
-
|
|
150
|
-
type ContextMenuCheckboxItemElement = React.ElementRef<typeof ContextMenuPrimitive.CheckboxItem>;
|
|
151
|
-
type ContextMenuCheckboxItemProps = React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.CheckboxItem>;
|
|
152
|
-
|
|
153
|
-
const ContextMenuCheckboxItem = React.forwardRef<ContextMenuCheckboxItemElement, ContextMenuCheckboxItemProps>(
|
|
154
|
-
({ children, className, checked, ...props }, forwardedRef) => (
|
|
155
|
-
<ContextMenuPrimitive.CheckboxItem
|
|
156
|
-
ref={forwardedRef}
|
|
157
|
-
checked={checked}
|
|
158
|
-
className={cn(
|
|
159
|
-
'focus:bg-accent focus:text-accent-foreground relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm focus:outline-none aria-disabled:pointer-events-none aria-disabled:opacity-50',
|
|
160
|
-
className,
|
|
161
|
-
)}
|
|
162
|
-
{...props}
|
|
163
|
-
>
|
|
164
|
-
<span className="absolute left-2 flex size-3.5 items-center justify-center">
|
|
165
|
-
<ContextMenuPrimitive.ItemIndicator>
|
|
166
|
-
<CheckIcon className="size-4" />
|
|
167
|
-
</ContextMenuPrimitive.ItemIndicator>
|
|
168
|
-
</span>
|
|
169
|
-
{children}
|
|
170
|
-
</ContextMenuPrimitive.CheckboxItem>
|
|
171
|
-
),
|
|
172
|
-
);
|
|
173
|
-
|
|
174
|
-
ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;
|
|
175
|
-
|
|
176
|
-
/* -----------------------------------------------------------------------------
|
|
177
|
-
* Component: ContextMenuRadioItem
|
|
178
|
-
* -------------------------------------------------------------------------- */
|
|
179
|
-
|
|
180
|
-
type ContextMenuRadioItemElement = React.ElementRef<typeof ContextMenuPrimitive.RadioItem>;
|
|
181
|
-
type ContextMenuRadioItemProps = React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.RadioItem>;
|
|
182
|
-
|
|
183
|
-
const ContextMenuRadioItem = React.forwardRef<ContextMenuRadioItemElement, ContextMenuRadioItemProps>(
|
|
184
|
-
({ children, className, ...props }, forwardedRef) => (
|
|
185
|
-
<ContextMenuPrimitive.RadioItem
|
|
186
|
-
ref={forwardedRef}
|
|
187
|
-
className={cn(
|
|
188
|
-
'focus:bg-accent focus:text-accent-foreground relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm focus:outline-none aria-disabled:pointer-events-none aria-disabled:opacity-50',
|
|
189
|
-
className,
|
|
190
|
-
)}
|
|
191
|
-
{...props}
|
|
192
|
-
>
|
|
193
|
-
<span className="absolute left-2 flex size-3.5 items-center justify-center">
|
|
194
|
-
<ContextMenuPrimitive.ItemIndicator>
|
|
195
|
-
<DotFilledIcon className="size-4 fill-current" />
|
|
196
|
-
</ContextMenuPrimitive.ItemIndicator>
|
|
197
|
-
</span>
|
|
198
|
-
{children}
|
|
199
|
-
</ContextMenuPrimitive.RadioItem>
|
|
200
|
-
),
|
|
201
|
-
);
|
|
202
|
-
|
|
203
|
-
ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName;
|
|
204
|
-
|
|
205
|
-
/* -----------------------------------------------------------------------------
|
|
206
|
-
* Component: ContextMenuLabel
|
|
207
|
-
* -------------------------------------------------------------------------- */
|
|
208
|
-
|
|
209
|
-
type ContextMenuLabelElement = React.ElementRef<typeof ContextMenuPrimitive.Label>;
|
|
210
|
-
|
|
211
|
-
interface ContextMenuLabelProps extends React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Label> {
|
|
212
|
-
inset?: boolean;
|
|
213
|
-
}
|
|
214
|
-
|
|
215
|
-
const ContextMenuLabel = React.forwardRef<ContextMenuLabelElement, ContextMenuLabelProps>(
|
|
216
|
-
({ className, inset, ...props }, forwardedRef) => (
|
|
217
|
-
<ContextMenuPrimitive.Label
|
|
218
|
-
ref={forwardedRef}
|
|
219
|
-
className={cn('text-foreground px-2 py-1.5 text-sm font-semibold', inset && 'pl-8', className)}
|
|
220
|
-
{...props}
|
|
221
|
-
/>
|
|
222
|
-
),
|
|
223
|
-
);
|
|
224
|
-
|
|
225
|
-
ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName;
|
|
226
|
-
|
|
227
|
-
/* -----------------------------------------------------------------------------
|
|
228
|
-
* Component: ContextMenuSeparator
|
|
229
|
-
* -------------------------------------------------------------------------- */
|
|
230
|
-
|
|
231
|
-
type ContextMenuSeparatorElement = React.ElementRef<typeof ContextMenuPrimitive.Separator>;
|
|
232
|
-
type ContextMenuSeparatorProps = React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Separator>;
|
|
233
|
-
|
|
234
|
-
const ContextMenuSeparator = React.forwardRef<ContextMenuSeparatorElement, ContextMenuSeparatorProps>(
|
|
235
|
-
({ className, ...props }, forwardedRef) => (
|
|
236
|
-
<ContextMenuPrimitive.Separator
|
|
237
|
-
ref={forwardedRef}
|
|
238
|
-
className={cn('bg-border -mx-1 my-1 h-px', className)}
|
|
239
|
-
{...props}
|
|
240
|
-
/>
|
|
241
|
-
),
|
|
242
|
-
);
|
|
243
|
-
|
|
244
|
-
ContextMenuSeparator.displayName = ContextMenuPrimitive.Separator.displayName;
|
|
245
|
-
|
|
246
|
-
/* -----------------------------------------------------------------------------
|
|
247
|
-
* Component: ContextMenuShortcut
|
|
248
|
-
* -------------------------------------------------------------------------- */
|
|
249
|
-
|
|
250
|
-
type ContextMenuShortcutProps = React.HTMLAttributes<HTMLSpanElement>;
|
|
251
|
-
|
|
252
|
-
function ContextMenuShortcut({ className, ...props }: ContextMenuShortcutProps): React.JSX.Element {
|
|
253
|
-
return <span className={cn('text-muted-foreground ml-auto text-xs tracking-widest', className)} {...props} />;
|
|
254
|
-
}
|
|
255
|
-
|
|
256
|
-
/* -----------------------------------------------------------------------------
|
|
257
|
-
* Component: ContextMenuArrow
|
|
258
|
-
* -------------------------------------------------------------------------- */
|
|
259
|
-
|
|
260
|
-
type ContextMenuArrowElement = React.ElementRef<typeof ContextMenuPrimitive.Arrow>;
|
|
261
|
-
type ContextMenuArrowProps = ContextMenuPrimitive.ContextMenuArrowProps;
|
|
262
|
-
|
|
263
|
-
const ContextMenuArrow = React.forwardRef<ContextMenuArrowElement, ContextMenuArrowProps>(
|
|
264
|
-
({ className, ...props }, forwardedRef) => (
|
|
265
|
-
<ContextMenuPrimitive.Arrow ref={forwardedRef} className={cn('fill-popover', className)} {...props} />
|
|
266
|
-
),
|
|
267
|
-
);
|
|
268
|
-
|
|
269
|
-
ContextMenuArrow.displayName = ContextMenuPrimitive.Arrow.displayName;
|
|
270
|
-
|
|
271
|
-
/* -----------------------------------------------------------------------------
|
|
272
|
-
* Exports
|
|
273
|
-
* -------------------------------------------------------------------------- */
|
|
274
|
-
|
|
275
|
-
export {
|
|
276
|
-
ContextMenu,
|
|
277
|
-
ContextMenuTrigger,
|
|
278
|
-
ContextMenuContent,
|
|
279
|
-
ContextMenuItem,
|
|
280
|
-
ContextMenuCheckboxItem,
|
|
281
|
-
ContextMenuRadioItem,
|
|
282
|
-
ContextMenuLabel,
|
|
283
|
-
ContextMenuSeparator,
|
|
284
|
-
ContextMenuShortcut,
|
|
285
|
-
ContextMenuGroup,
|
|
286
|
-
ContextMenuSub,
|
|
287
|
-
ContextMenuSubContent,
|
|
288
|
-
ContextMenuSubTrigger,
|
|
289
|
-
ContextMenuRadioGroup,
|
|
290
|
-
ContextMenuArrow,
|
|
291
|
-
type ContextMenuProps,
|
|
292
|
-
type ContextMenuTriggerProps,
|
|
293
|
-
type ContextMenuContentProps,
|
|
294
|
-
type ContextMenuItemProps,
|
|
295
|
-
type ContextMenuCheckboxItemProps,
|
|
296
|
-
type ContextMenuRadioItemProps,
|
|
297
|
-
type ContextMenuLabelProps,
|
|
298
|
-
type ContextMenuSeparatorProps,
|
|
299
|
-
type ContextMenuShortcutProps,
|
|
300
|
-
type ContextMenuGroupProps,
|
|
301
|
-
type ContextMenuSubProps,
|
|
302
|
-
type ContextMenuSubContentProps,
|
|
303
|
-
type ContextMenuSubTriggerProps,
|
|
304
|
-
type ContextMenuRadioGroupProps,
|
|
305
|
-
type ContextMenuArrowProps,
|
|
306
|
-
};
|