@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.
Files changed (122) hide show
  1. package/dist/styles.css +1 -1
  2. package/dist/styles.css.map +1 -1
  3. package/package.json +70 -102
  4. package/dist/chunk-DH3YP4ZC.cjs +0 -2
  5. package/dist/chunk-DH3YP4ZC.cjs.map +0 -1
  6. package/dist/chunk-DTSAQICV.js +0 -2
  7. package/dist/chunk-DTSAQICV.js.map +0 -1
  8. package/dist/chunk-NH6X3FON.js +0 -2
  9. package/dist/chunk-NH6X3FON.js.map +0 -1
  10. package/dist/chunk-P563ILDJ.cjs +0 -2
  11. package/dist/chunk-P563ILDJ.cjs.map +0 -1
  12. package/dist/chunk-VVA2EE5V.js +0 -2
  13. package/dist/chunk-VVA2EE5V.js.map +0 -1
  14. package/dist/chunk-VZ6P3BCB.cjs +0 -2
  15. package/dist/chunk-VZ6P3BCB.cjs.map +0 -1
  16. package/dist/hooks/use-media-query.cjs +0 -2
  17. package/dist/hooks/use-media-query.cjs.map +0 -1
  18. package/dist/hooks/use-media-query.d.cts +0 -3
  19. package/dist/hooks/use-media-query.d.ts +0 -3
  20. package/dist/hooks/use-media-query.js +0 -2
  21. package/dist/hooks/use-media-query.js.map +0 -1
  22. package/dist/hooks/use-mutation-observer.cjs +0 -2
  23. package/dist/hooks/use-mutation-observer.cjs.map +0 -1
  24. package/dist/hooks/use-mutation-observer.d.cts +0 -5
  25. package/dist/hooks/use-mutation-observer.d.ts +0 -5
  26. package/dist/hooks/use-mutation-observer.js +0 -2
  27. package/dist/hooks/use-mutation-observer.js.map +0 -1
  28. package/dist/lib/colors.cjs +0 -2
  29. package/dist/lib/colors.cjs.map +0 -1
  30. package/dist/lib/colors.d.cts +0 -1759
  31. package/dist/lib/colors.d.ts +0 -1759
  32. package/dist/lib/colors.js +0 -2
  33. package/dist/lib/colors.js.map +0 -1
  34. package/dist/plugin/animate.plugin.cjs +0 -2
  35. package/dist/plugin/animate.plugin.cjs.map +0 -1
  36. package/dist/plugin/animate.plugin.js +0 -2
  37. package/dist/plugin/animate.plugin.js.map +0 -1
  38. package/dist/plugin/base.plugin.cjs +0 -2
  39. package/dist/plugin/base.plugin.cjs.map +0 -1
  40. package/dist/plugin/base.plugin.js +0 -2
  41. package/dist/plugin/base.plugin.js.map +0 -1
  42. package/dist/plugin/perspective.plugin.cjs +0 -2
  43. package/dist/plugin/perspective.plugin.cjs.map +0 -1
  44. package/dist/plugin/perspective.plugin.js +0 -2
  45. package/dist/plugin/perspective.plugin.js.map +0 -1
  46. package/dist/tailwind.config.cjs +0 -2
  47. package/dist/tailwind.config.cjs.map +0 -1
  48. package/dist/tailwind.config.js +0 -2
  49. package/dist/tailwind.config.js.map +0 -1
  50. package/plugin/animate.plugin.ts +0 -319
  51. package/plugin/base.plugin.ts +0 -21
  52. package/plugin/perspective.plugin.ts +0 -11
  53. package/src/hooks/use-media-query.ts +0 -22
  54. package/src/hooks/use-mutation-observer.ts +0 -26
  55. package/src/lib/colors.ts +0 -1757
  56. package/src/lib/utils.ts +0 -6
  57. package/src/react/accordion.tsx +0 -88
  58. package/src/react/alert-dialog.tsx +0 -185
  59. package/src/react/alert.tsx +0 -73
  60. package/src/react/aspect-ratio.tsx +0 -17
  61. package/src/react/avatar.tsx +0 -60
  62. package/src/react/badge.tsx +0 -39
  63. package/src/react/blockquote.tsx +0 -26
  64. package/src/react/box.tsx +0 -34
  65. package/src/react/breadcrumb.tsx +0 -154
  66. package/src/react/button.tsx +0 -94
  67. package/src/react/calendar.tsx +0 -79
  68. package/src/react/card.tsx +0 -109
  69. package/src/react/carousel.tsx +0 -299
  70. package/src/react/checkbox-cards.tsx +0 -61
  71. package/src/react/checkbox-group.primitive.tsx +0 -206
  72. package/src/react/checkbox-group.tsx +0 -55
  73. package/src/react/checkbox.tsx +0 -36
  74. package/src/react/code.tsx +0 -26
  75. package/src/react/collapsible.tsx +0 -54
  76. package/src/react/command.tsx +0 -209
  77. package/src/react/container.tsx +0 -29
  78. package/src/react/context-menu.tsx +0 -306
  79. package/src/react/data-table.tsx +0 -249
  80. package/src/react/dialog.tsx +0 -160
  81. package/src/react/drawer.tsx +0 -136
  82. package/src/react/dropdown-menu.tsx +0 -290
  83. package/src/react/em.tsx +0 -26
  84. package/src/react/form.tsx +0 -234
  85. package/src/react/heading.tsx +0 -29
  86. package/src/react/hover-card.tsx +0 -75
  87. package/src/react/input-otp.tsx +0 -120
  88. package/src/react/input.tsx +0 -145
  89. package/src/react/kbd.tsx +0 -36
  90. package/src/react/label.tsx +0 -31
  91. package/src/react/menubar.tsx +0 -322
  92. package/src/react/navigation-menu.tsx +0 -192
  93. package/src/react/pagination.tsx +0 -150
  94. package/src/react/popover.tsx +0 -84
  95. package/src/react/pre.tsx +0 -26
  96. package/src/react/progress.tsx +0 -35
  97. package/src/react/quote.tsx +0 -26
  98. package/src/react/radio-cards.tsx +0 -48
  99. package/src/react/radio-group.tsx +0 -50
  100. package/src/react/radio.tsx +0 -40
  101. package/src/react/resizable.tsx +0 -62
  102. package/src/react/scroll-area.tsx +0 -106
  103. package/src/react/section.tsx +0 -26
  104. package/src/react/select.tsx +0 -219
  105. package/src/react/separator.tsx +0 -32
  106. package/src/react/sheet.tsx +0 -178
  107. package/src/react/skeleton.tsx +0 -18
  108. package/src/react/slider.tsx +0 -41
  109. package/src/react/sonner.tsx +0 -40
  110. package/src/react/spinner.tsx +0 -68
  111. package/src/react/strong.tsx +0 -26
  112. package/src/react/switch.tsx +0 -33
  113. package/src/react/table.tsx +0 -148
  114. package/src/react/tabs.tsx +0 -87
  115. package/src/react/text-input.tsx +0 -36
  116. package/src/react/text.tsx +0 -34
  117. package/src/react/textarea.tsx +0 -30
  118. package/src/react/toggle-group.tsx +0 -84
  119. package/src/react/toggle.tsx +0 -49
  120. package/src/react/tooltip.tsx +0 -83
  121. package/src/styles/styles.css +0 -3
  122. 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
- };
@@ -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
- };
@@ -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
- };