@c-rex/ui 0.1.19 → 0.1.21
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/README.md +19 -19
- package/package.json +207 -205
- package/src/alert.tsx +58 -58
- package/src/avatar.tsx +47 -47
- package/src/badge.tsx +46 -46
- package/src/breadcrumb.tsx +113 -113
- package/src/button.tsx +69 -69
- package/src/card.tsx +92 -92
- package/src/checkbox.tsx +30 -30
- package/src/collapsible.tsx +31 -31
- package/src/command.tsx +151 -151
- package/src/context-menu.tsx +250 -250
- package/src/dialog.tsx +122 -122
- package/src/drawer.tsx +133 -133
- package/src/dropdown-hover-item.tsx +27 -27
- package/src/dropdown-menu.tsx +273 -273
- package/src/hooks/index.tsx +27 -27
- package/src/input-group.tsx +189 -189
- package/src/input.tsx +42 -42
- package/src/label.tsx +22 -22
- package/src/navigation-menu.tsx +169 -168
- package/src/pagination.tsx +124 -124
- package/src/popover.tsx +31 -31
- package/src/radio-group.tsx +43 -43
- package/src/select.tsx +157 -157
- package/src/separator.tsx +29 -29
- package/src/sheet.tsx +140 -140
- package/src/sidebar.tsx +833 -835
- package/src/skeleton.tsx +15 -15
- package/src/sonner.tsx +10 -10
- package/src/switch.tsx +29 -29
- package/src/table.tsx +120 -120
- package/src/tabs.tsx +64 -64
- package/src/textarea.tsx +18 -18
- package/src/toggle-group.tsx +71 -71
- package/src/toggle.tsx +47 -47
- package/src/tooltip.tsx +30 -30
package/src/radio-group.tsx
CHANGED
|
@@ -1,43 +1,43 @@
|
|
|
1
|
-
import * as React from "react"
|
|
2
|
-
import * as RadioGroupPrimitive from "@radix-ui/react-radio-group"
|
|
3
|
-
import { CircleIcon } from "lucide-react"
|
|
4
|
-
|
|
5
|
-
import { cn } from "@c-rex/utils"
|
|
6
|
-
|
|
7
|
-
function RadioGroup({
|
|
8
|
-
className,
|
|
9
|
-
...props
|
|
10
|
-
}: React.ComponentProps<typeof RadioGroupPrimitive.Root>) {
|
|
11
|
-
return (
|
|
12
|
-
<RadioGroupPrimitive.Root
|
|
13
|
-
data-slot="radio-group"
|
|
14
|
-
className={cn("grid gap-3", className)}
|
|
15
|
-
{...props}
|
|
16
|
-
/>
|
|
17
|
-
)
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
function RadioGroupItem({
|
|
21
|
-
className,
|
|
22
|
-
...props
|
|
23
|
-
}: React.ComponentProps<typeof RadioGroupPrimitive.Item>) {
|
|
24
|
-
return (
|
|
25
|
-
<RadioGroupPrimitive.Item
|
|
26
|
-
data-slot="radio-group-item"
|
|
27
|
-
className={cn(
|
|
28
|
-
"border-input text-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
|
|
29
|
-
className
|
|
30
|
-
)}
|
|
31
|
-
{...props}
|
|
32
|
-
>
|
|
33
|
-
<RadioGroupPrimitive.Indicator
|
|
34
|
-
data-slot="radio-group-indicator"
|
|
35
|
-
className="relative flex items-center justify-center"
|
|
36
|
-
>
|
|
37
|
-
<CircleIcon className="fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2" />
|
|
38
|
-
</RadioGroupPrimitive.Indicator>
|
|
39
|
-
</RadioGroupPrimitive.Item>
|
|
40
|
-
)
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
export { RadioGroup, RadioGroupItem }
|
|
1
|
+
import * as React from "react"
|
|
2
|
+
import * as RadioGroupPrimitive from "@radix-ui/react-radio-group"
|
|
3
|
+
import { CircleIcon } from "lucide-react"
|
|
4
|
+
|
|
5
|
+
import { cn } from "@c-rex/utils"
|
|
6
|
+
|
|
7
|
+
function RadioGroup({
|
|
8
|
+
className,
|
|
9
|
+
...props
|
|
10
|
+
}: React.ComponentProps<typeof RadioGroupPrimitive.Root>) {
|
|
11
|
+
return (
|
|
12
|
+
<RadioGroupPrimitive.Root
|
|
13
|
+
data-slot="radio-group"
|
|
14
|
+
className={cn("grid gap-3", className)}
|
|
15
|
+
{...props}
|
|
16
|
+
/>
|
|
17
|
+
)
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
function RadioGroupItem({
|
|
21
|
+
className,
|
|
22
|
+
...props
|
|
23
|
+
}: React.ComponentProps<typeof RadioGroupPrimitive.Item>) {
|
|
24
|
+
return (
|
|
25
|
+
<RadioGroupPrimitive.Item
|
|
26
|
+
data-slot="radio-group-item"
|
|
27
|
+
className={cn(
|
|
28
|
+
"border-input text-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
|
|
29
|
+
className
|
|
30
|
+
)}
|
|
31
|
+
{...props}
|
|
32
|
+
>
|
|
33
|
+
<RadioGroupPrimitive.Indicator
|
|
34
|
+
data-slot="radio-group-indicator"
|
|
35
|
+
className="relative flex items-center justify-center"
|
|
36
|
+
>
|
|
37
|
+
<CircleIcon className="fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2" />
|
|
38
|
+
</RadioGroupPrimitive.Indicator>
|
|
39
|
+
</RadioGroupPrimitive.Item>
|
|
40
|
+
)
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
export { RadioGroup, RadioGroupItem }
|
package/src/select.tsx
CHANGED
|
@@ -1,157 +1,157 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import * as SelectPrimitive from "@radix-ui/react-select";
|
|
3
|
-
import { Check, ChevronDown, ChevronUp } from "lucide-react";
|
|
4
|
-
|
|
5
|
-
import { cn } from "@c-rex/utils";
|
|
6
|
-
|
|
7
|
-
const Select = SelectPrimitive.Root;
|
|
8
|
-
|
|
9
|
-
const SelectGroup = SelectPrimitive.Group;
|
|
10
|
-
|
|
11
|
-
const SelectValue = SelectPrimitive.Value;
|
|
12
|
-
|
|
13
|
-
const SelectTrigger = React.forwardRef<
|
|
14
|
-
React.ElementRef<typeof SelectPrimitive.Trigger>,
|
|
15
|
-
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>
|
|
16
|
-
>(({ className, children, ...props }, ref) => (
|
|
17
|
-
<SelectPrimitive.Trigger
|
|
18
|
-
ref={ref}
|
|
19
|
-
className={cn(
|
|
20
|
-
"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 data-[placeholder]:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
|
|
21
|
-
className,
|
|
22
|
-
)}
|
|
23
|
-
{...props}
|
|
24
|
-
>
|
|
25
|
-
{children}
|
|
26
|
-
<SelectPrimitive.Icon asChild>
|
|
27
|
-
<ChevronDown className="h-4 w-4 opacity-50" />
|
|
28
|
-
</SelectPrimitive.Icon>
|
|
29
|
-
</SelectPrimitive.Trigger>
|
|
30
|
-
));
|
|
31
|
-
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
|
|
32
|
-
|
|
33
|
-
const SelectScrollUpButton = React.forwardRef<
|
|
34
|
-
React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
|
|
35
|
-
React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>
|
|
36
|
-
>(({ className, ...props }, ref) => (
|
|
37
|
-
<SelectPrimitive.ScrollUpButton
|
|
38
|
-
ref={ref}
|
|
39
|
-
className={cn(
|
|
40
|
-
"flex cursor-default items-center justify-center py-1",
|
|
41
|
-
className,
|
|
42
|
-
)}
|
|
43
|
-
{...props}
|
|
44
|
-
>
|
|
45
|
-
<ChevronUp className="h-4 w-4" />
|
|
46
|
-
</SelectPrimitive.ScrollUpButton>
|
|
47
|
-
));
|
|
48
|
-
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
|
|
49
|
-
|
|
50
|
-
const SelectScrollDownButton = React.forwardRef<
|
|
51
|
-
React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
|
|
52
|
-
React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>
|
|
53
|
-
>(({ className, ...props }, ref) => (
|
|
54
|
-
<SelectPrimitive.ScrollDownButton
|
|
55
|
-
ref={ref}
|
|
56
|
-
className={cn(
|
|
57
|
-
"flex cursor-default items-center justify-center py-1",
|
|
58
|
-
className,
|
|
59
|
-
)}
|
|
60
|
-
{...props}
|
|
61
|
-
>
|
|
62
|
-
<ChevronDown className="h-4 w-4" />
|
|
63
|
-
</SelectPrimitive.ScrollDownButton>
|
|
64
|
-
));
|
|
65
|
-
SelectScrollDownButton.displayName =
|
|
66
|
-
SelectPrimitive.ScrollDownButton.displayName;
|
|
67
|
-
|
|
68
|
-
const SelectContent = React.forwardRef<
|
|
69
|
-
React.ElementRef<typeof SelectPrimitive.Content>,
|
|
70
|
-
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>
|
|
71
|
-
>(({ className, children, position = "popper", ...props }, ref) => (
|
|
72
|
-
<SelectPrimitive.Portal>
|
|
73
|
-
<SelectPrimitive.Content
|
|
74
|
-
ref={ref}
|
|
75
|
-
className={cn(
|
|
76
|
-
"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",
|
|
77
|
-
position === "popper" &&
|
|
78
|
-
"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
|
79
|
-
className,
|
|
80
|
-
)}
|
|
81
|
-
position={position}
|
|
82
|
-
{...props}
|
|
83
|
-
>
|
|
84
|
-
<SelectScrollUpButton />
|
|
85
|
-
<SelectPrimitive.Viewport
|
|
86
|
-
className={cn(
|
|
87
|
-
"p-1",
|
|
88
|
-
position === "popper" &&
|
|
89
|
-
"h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]",
|
|
90
|
-
)}
|
|
91
|
-
>
|
|
92
|
-
{children}
|
|
93
|
-
</SelectPrimitive.Viewport>
|
|
94
|
-
<SelectScrollDownButton />
|
|
95
|
-
</SelectPrimitive.Content>
|
|
96
|
-
</SelectPrimitive.Portal>
|
|
97
|
-
));
|
|
98
|
-
SelectContent.displayName = SelectPrimitive.Content.displayName;
|
|
99
|
-
|
|
100
|
-
const SelectLabel = React.forwardRef<
|
|
101
|
-
React.ElementRef<typeof SelectPrimitive.Label>,
|
|
102
|
-
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>
|
|
103
|
-
>(({ className, ...props }, ref) => (
|
|
104
|
-
<SelectPrimitive.Label
|
|
105
|
-
ref={ref}
|
|
106
|
-
className={cn("px-2 py-1.5 text-sm font-semibold", className)}
|
|
107
|
-
{...props}
|
|
108
|
-
/>
|
|
109
|
-
));
|
|
110
|
-
SelectLabel.displayName = SelectPrimitive.Label.displayName;
|
|
111
|
-
|
|
112
|
-
const SelectItem = React.forwardRef<
|
|
113
|
-
React.ElementRef<typeof SelectPrimitive.Item>,
|
|
114
|
-
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>
|
|
115
|
-
>(({ className, children, ...props }, ref) => (
|
|
116
|
-
<SelectPrimitive.Item
|
|
117
|
-
ref={ref}
|
|
118
|
-
className={cn(
|
|
119
|
-
"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",
|
|
120
|
-
className,
|
|
121
|
-
)}
|
|
122
|
-
{...props}
|
|
123
|
-
>
|
|
124
|
-
<span className="absolute right-2 flex h-3.5 w-3.5 items-center justify-center">
|
|
125
|
-
<SelectPrimitive.ItemIndicator>
|
|
126
|
-
<Check className="h-4 w-4" />
|
|
127
|
-
</SelectPrimitive.ItemIndicator>
|
|
128
|
-
</span>
|
|
129
|
-
<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
|
|
130
|
-
</SelectPrimitive.Item>
|
|
131
|
-
));
|
|
132
|
-
SelectItem.displayName = SelectPrimitive.Item.displayName;
|
|
133
|
-
|
|
134
|
-
const SelectSeparator = React.forwardRef<
|
|
135
|
-
React.ElementRef<typeof SelectPrimitive.Separator>,
|
|
136
|
-
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator>
|
|
137
|
-
>(({ className, ...props }, ref) => (
|
|
138
|
-
<SelectPrimitive.Separator
|
|
139
|
-
ref={ref}
|
|
140
|
-
className={cn("-mx-1 my-1 h-px bg-muted", className)}
|
|
141
|
-
{...props}
|
|
142
|
-
/>
|
|
143
|
-
));
|
|
144
|
-
SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
|
|
145
|
-
|
|
146
|
-
export {
|
|
147
|
-
Select,
|
|
148
|
-
SelectGroup,
|
|
149
|
-
SelectValue,
|
|
150
|
-
SelectTrigger,
|
|
151
|
-
SelectContent,
|
|
152
|
-
SelectLabel,
|
|
153
|
-
SelectItem,
|
|
154
|
-
SelectSeparator,
|
|
155
|
-
SelectScrollUpButton,
|
|
156
|
-
SelectScrollDownButton,
|
|
157
|
-
};
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import * as SelectPrimitive from "@radix-ui/react-select";
|
|
3
|
+
import { Check, ChevronDown, ChevronUp } from "lucide-react";
|
|
4
|
+
|
|
5
|
+
import { cn } from "@c-rex/utils";
|
|
6
|
+
|
|
7
|
+
const Select = SelectPrimitive.Root;
|
|
8
|
+
|
|
9
|
+
const SelectGroup = SelectPrimitive.Group;
|
|
10
|
+
|
|
11
|
+
const SelectValue = SelectPrimitive.Value;
|
|
12
|
+
|
|
13
|
+
const SelectTrigger = React.forwardRef<
|
|
14
|
+
React.ElementRef<typeof SelectPrimitive.Trigger>,
|
|
15
|
+
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>
|
|
16
|
+
>(({ className, children, ...props }, ref) => (
|
|
17
|
+
<SelectPrimitive.Trigger
|
|
18
|
+
ref={ref}
|
|
19
|
+
className={cn(
|
|
20
|
+
"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 data-[placeholder]:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
|
|
21
|
+
className,
|
|
22
|
+
)}
|
|
23
|
+
{...props}
|
|
24
|
+
>
|
|
25
|
+
{children}
|
|
26
|
+
<SelectPrimitive.Icon asChild>
|
|
27
|
+
<ChevronDown className="h-4 w-4 opacity-50" />
|
|
28
|
+
</SelectPrimitive.Icon>
|
|
29
|
+
</SelectPrimitive.Trigger>
|
|
30
|
+
));
|
|
31
|
+
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
|
|
32
|
+
|
|
33
|
+
const SelectScrollUpButton = React.forwardRef<
|
|
34
|
+
React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
|
|
35
|
+
React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>
|
|
36
|
+
>(({ className, ...props }, ref) => (
|
|
37
|
+
<SelectPrimitive.ScrollUpButton
|
|
38
|
+
ref={ref}
|
|
39
|
+
className={cn(
|
|
40
|
+
"flex cursor-default items-center justify-center py-1",
|
|
41
|
+
className,
|
|
42
|
+
)}
|
|
43
|
+
{...props}
|
|
44
|
+
>
|
|
45
|
+
<ChevronUp className="h-4 w-4" />
|
|
46
|
+
</SelectPrimitive.ScrollUpButton>
|
|
47
|
+
));
|
|
48
|
+
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
|
|
49
|
+
|
|
50
|
+
const SelectScrollDownButton = React.forwardRef<
|
|
51
|
+
React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
|
|
52
|
+
React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>
|
|
53
|
+
>(({ className, ...props }, ref) => (
|
|
54
|
+
<SelectPrimitive.ScrollDownButton
|
|
55
|
+
ref={ref}
|
|
56
|
+
className={cn(
|
|
57
|
+
"flex cursor-default items-center justify-center py-1",
|
|
58
|
+
className,
|
|
59
|
+
)}
|
|
60
|
+
{...props}
|
|
61
|
+
>
|
|
62
|
+
<ChevronDown className="h-4 w-4" />
|
|
63
|
+
</SelectPrimitive.ScrollDownButton>
|
|
64
|
+
));
|
|
65
|
+
SelectScrollDownButton.displayName =
|
|
66
|
+
SelectPrimitive.ScrollDownButton.displayName;
|
|
67
|
+
|
|
68
|
+
const SelectContent = React.forwardRef<
|
|
69
|
+
React.ElementRef<typeof SelectPrimitive.Content>,
|
|
70
|
+
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>
|
|
71
|
+
>(({ className, children, position = "popper", ...props }, ref) => (
|
|
72
|
+
<SelectPrimitive.Portal>
|
|
73
|
+
<SelectPrimitive.Content
|
|
74
|
+
ref={ref}
|
|
75
|
+
className={cn(
|
|
76
|
+
"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",
|
|
77
|
+
position === "popper" &&
|
|
78
|
+
"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
|
79
|
+
className,
|
|
80
|
+
)}
|
|
81
|
+
position={position}
|
|
82
|
+
{...props}
|
|
83
|
+
>
|
|
84
|
+
<SelectScrollUpButton />
|
|
85
|
+
<SelectPrimitive.Viewport
|
|
86
|
+
className={cn(
|
|
87
|
+
"p-1",
|
|
88
|
+
position === "popper" &&
|
|
89
|
+
"h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]",
|
|
90
|
+
)}
|
|
91
|
+
>
|
|
92
|
+
{children}
|
|
93
|
+
</SelectPrimitive.Viewport>
|
|
94
|
+
<SelectScrollDownButton />
|
|
95
|
+
</SelectPrimitive.Content>
|
|
96
|
+
</SelectPrimitive.Portal>
|
|
97
|
+
));
|
|
98
|
+
SelectContent.displayName = SelectPrimitive.Content.displayName;
|
|
99
|
+
|
|
100
|
+
const SelectLabel = React.forwardRef<
|
|
101
|
+
React.ElementRef<typeof SelectPrimitive.Label>,
|
|
102
|
+
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>
|
|
103
|
+
>(({ className, ...props }, ref) => (
|
|
104
|
+
<SelectPrimitive.Label
|
|
105
|
+
ref={ref}
|
|
106
|
+
className={cn("px-2 py-1.5 text-sm font-semibold", className)}
|
|
107
|
+
{...props}
|
|
108
|
+
/>
|
|
109
|
+
));
|
|
110
|
+
SelectLabel.displayName = SelectPrimitive.Label.displayName;
|
|
111
|
+
|
|
112
|
+
const SelectItem = React.forwardRef<
|
|
113
|
+
React.ElementRef<typeof SelectPrimitive.Item>,
|
|
114
|
+
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>
|
|
115
|
+
>(({ className, children, ...props }, ref) => (
|
|
116
|
+
<SelectPrimitive.Item
|
|
117
|
+
ref={ref}
|
|
118
|
+
className={cn(
|
|
119
|
+
"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",
|
|
120
|
+
className,
|
|
121
|
+
)}
|
|
122
|
+
{...props}
|
|
123
|
+
>
|
|
124
|
+
<span className="absolute right-2 flex h-3.5 w-3.5 items-center justify-center">
|
|
125
|
+
<SelectPrimitive.ItemIndicator>
|
|
126
|
+
<Check className="h-4 w-4" />
|
|
127
|
+
</SelectPrimitive.ItemIndicator>
|
|
128
|
+
</span>
|
|
129
|
+
<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
|
|
130
|
+
</SelectPrimitive.Item>
|
|
131
|
+
));
|
|
132
|
+
SelectItem.displayName = SelectPrimitive.Item.displayName;
|
|
133
|
+
|
|
134
|
+
const SelectSeparator = React.forwardRef<
|
|
135
|
+
React.ElementRef<typeof SelectPrimitive.Separator>,
|
|
136
|
+
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator>
|
|
137
|
+
>(({ className, ...props }, ref) => (
|
|
138
|
+
<SelectPrimitive.Separator
|
|
139
|
+
ref={ref}
|
|
140
|
+
className={cn("-mx-1 my-1 h-px bg-muted", className)}
|
|
141
|
+
{...props}
|
|
142
|
+
/>
|
|
143
|
+
));
|
|
144
|
+
SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
|
|
145
|
+
|
|
146
|
+
export {
|
|
147
|
+
Select,
|
|
148
|
+
SelectGroup,
|
|
149
|
+
SelectValue,
|
|
150
|
+
SelectTrigger,
|
|
151
|
+
SelectContent,
|
|
152
|
+
SelectLabel,
|
|
153
|
+
SelectItem,
|
|
154
|
+
SelectSeparator,
|
|
155
|
+
SelectScrollUpButton,
|
|
156
|
+
SelectScrollDownButton,
|
|
157
|
+
};
|
package/src/separator.tsx
CHANGED
|
@@ -1,29 +1,29 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import * as SeparatorPrimitive from "@radix-ui/react-separator";
|
|
3
|
-
|
|
4
|
-
import { cn } from "@c-rex/utils";
|
|
5
|
-
|
|
6
|
-
const Separator = React.forwardRef<
|
|
7
|
-
React.ElementRef<typeof SeparatorPrimitive.Root>,
|
|
8
|
-
React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>
|
|
9
|
-
>(
|
|
10
|
-
(
|
|
11
|
-
{ className, orientation = "horizontal", decorative = true, ...props },
|
|
12
|
-
ref,
|
|
13
|
-
) => (
|
|
14
|
-
<SeparatorPrimitive.Root
|
|
15
|
-
ref={ref}
|
|
16
|
-
decorative={decorative}
|
|
17
|
-
orientation={orientation}
|
|
18
|
-
className={cn(
|
|
19
|
-
"shrink-0 bg-border",
|
|
20
|
-
orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
|
|
21
|
-
className,
|
|
22
|
-
)}
|
|
23
|
-
{...props}
|
|
24
|
-
/>
|
|
25
|
-
),
|
|
26
|
-
);
|
|
27
|
-
Separator.displayName = SeparatorPrimitive.Root.displayName;
|
|
28
|
-
|
|
29
|
-
export { Separator };
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import * as SeparatorPrimitive from "@radix-ui/react-separator";
|
|
3
|
+
|
|
4
|
+
import { cn } from "@c-rex/utils";
|
|
5
|
+
|
|
6
|
+
const Separator = React.forwardRef<
|
|
7
|
+
React.ElementRef<typeof SeparatorPrimitive.Root>,
|
|
8
|
+
React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>
|
|
9
|
+
>(
|
|
10
|
+
(
|
|
11
|
+
{ className, orientation = "horizontal", decorative = true, ...props },
|
|
12
|
+
ref,
|
|
13
|
+
) => (
|
|
14
|
+
<SeparatorPrimitive.Root
|
|
15
|
+
ref={ref}
|
|
16
|
+
decorative={decorative}
|
|
17
|
+
orientation={orientation}
|
|
18
|
+
className={cn(
|
|
19
|
+
"shrink-0 bg-border",
|
|
20
|
+
orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
|
|
21
|
+
className,
|
|
22
|
+
)}
|
|
23
|
+
{...props}
|
|
24
|
+
/>
|
|
25
|
+
),
|
|
26
|
+
);
|
|
27
|
+
Separator.displayName = SeparatorPrimitive.Root.displayName;
|
|
28
|
+
|
|
29
|
+
export { Separator };
|