@allbluecn/ui 0.3.13 → 0.4.0
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/ai-command-button.d.ts +10 -0
- package/dist/ai-command-button.js +12 -0
- package/dist/ai-stream-text.d.ts +9 -0
- package/dist/ai-stream-text.js +12 -0
- package/dist/alert-dialog.d.ts +20 -0
- package/dist/alert-dialog.js +101 -0
- package/dist/animated-theme-toggler.d.ts +11 -0
- package/dist/animated-theme-toggler.js +169 -0
- package/dist/auth-client.d.ts +27 -0
- package/dist/auth-client.js +86 -0
- package/dist/auth-layout.d.ts +14 -0
- package/dist/auth-layout.js +43 -0
- package/dist/avatar.d.ts +13 -0
- package/dist/avatar.js +51 -0
- package/dist/badge.d.ts +11 -0
- package/dist/badge.js +28 -0
- package/dist/button.d.ts +12 -0
- package/dist/button.js +48 -0
- package/dist/card.d.ts +13 -0
- package/dist/card.js +56 -0
- package/dist/checkbox.d.ts +6 -0
- package/dist/checkbox.js +22 -0
- package/dist/context-menu.d.ts +33 -0
- package/dist/context-menu.js +125 -0
- package/dist/dialog.d.ts +19 -0
- package/dist/dialog.js +95 -0
- package/dist/dropdown-menu.d.ts +31 -0
- package/dist/dropdown-menu.js +128 -0
- package/dist/empty.d.ts +13 -0
- package/dist/empty.js +59 -0
- package/dist/grid-pattern.d.ts +14 -0
- package/dist/grid-pattern.js +47 -0
- package/dist/icon-packs/index.d.ts +2 -0
- package/dist/icon-packs/index.js +4 -0
- package/dist/icon-packs/knowledge.d.ts +2 -0
- package/dist/icon-packs/knowledge.js +70 -0
- package/dist/icon-packs/prd.d.ts +2 -0
- package/dist/icon-packs/prd.js +86 -0
- package/dist/icon-packs/project.d.ts +2 -0
- package/dist/icon-packs/project.js +74 -0
- package/dist/icon-picker.d.ts +11 -0
- package/dist/icon-picker.js +39 -0
- package/dist/index-CQsbeClc.d.ts +17 -0
- package/dist/index.d.ts +7 -0
- package/dist/index.js +7 -0
- package/dist/input.d.ts +5 -0
- package/dist/input.js +14 -0
- package/dist/item.d.ts +25 -0
- package/dist/item.js +118 -0
- package/dist/kbd.d.ts +4 -0
- package/dist/kbd.js +12 -0
- package/dist/label.d.ts +6 -0
- package/dist/label.js +14 -0
- package/dist/layout-panel-top.d.ts +12 -0
- package/dist/layout-panel-top.js +127 -0
- package/dist/name-confirm-dialog.d.ts +15 -0
- package/dist/name-confirm-dialog.js +105 -0
- package/dist/nav-float-button.d.ts +12 -0
- package/dist/nav-float-button.js +249 -0
- package/dist/notion-avatar.d.ts +13 -0
- package/dist/notion-avatar.js +83 -0
- package/dist/placeholder-page.d.ts +10 -0
- package/dist/placeholder-page.js +28 -0
- package/dist/popover.d.ts +12 -0
- package/dist/popover.js +56 -0
- package/dist/reference-inline.d.ts +10 -0
- package/dist/reference-inline.js +35 -0
- package/dist/reference-search.d.ts +12 -0
- package/dist/reference-search.js +26 -0
- package/dist/resizable.d.ts +9 -0
- package/dist/resizable.js +28 -0
- package/dist/select.d.ts +17 -0
- package/dist/select.js +99 -0
- package/dist/separator.d.ts +6 -0
- package/dist/separator.js +17 -0
- package/dist/sheet.d.ts +16 -0
- package/dist/sheet.js +90 -0
- package/dist/sidebar.d.ts +71 -0
- package/dist/sidebar.js +369 -0
- package/dist/skeleton.d.ts +4 -0
- package/dist/skeleton.js +12 -0
- package/dist/sonner.d.ts +5 -0
- package/dist/sonner.js +19 -0
- package/dist/switch.d.ts +8 -0
- package/dist/switch.js +19 -0
- package/dist/textarea.d.ts +5 -0
- package/dist/textarea.js +13 -0
- package/dist/timezone-provider.d.ts +18 -0
- package/dist/timezone-provider.js +29 -0
- package/dist/tooltip.d.ts +9 -0
- package/dist/tooltip.js +35 -0
- package/dist/use-mobile.d.ts +4 -0
- package/dist/use-mobile.js +18 -0
- package/dist/user-avatar.d.ts +14 -0
- package/dist/user-avatar.js +34 -0
- package/dist/utils.d.ts +5 -0
- package/dist/utils.js +8 -0
- package/package.json +178 -49
- package/src/ai-command-button.tsx +0 -36
- package/src/ai-stream-text.tsx +0 -37
- package/src/alert-dialog.tsx +0 -216
- package/src/animated-theme-toggler.tsx +0 -272
- package/src/auth-client.ts +0 -108
- package/src/auth-layout.tsx +0 -66
- package/src/avatar.tsx +0 -129
- package/src/badge.tsx +0 -66
- package/src/button.tsx +0 -84
- package/src/card.tsx +0 -120
- package/src/checkbox.tsx +0 -50
- package/src/context-menu.tsx +0 -280
- package/src/dialog.tsx +0 -183
- package/src/dropdown-menu.tsx +0 -286
- package/src/empty.tsx +0 -121
- package/src/grid-pattern.tsx +0 -87
- package/src/icon-packs/index.ts +0 -27
- package/src/icon-packs/knowledge.ts +0 -55
- package/src/icon-packs/prd.ts +0 -63
- package/src/icon-packs/project.ts +0 -59
- package/src/icon-picker.tsx +0 -68
- package/src/index.ts +0 -23
- package/src/input.tsx +0 -36
- package/src/item.tsx +0 -213
- package/src/kbd.tsx +0 -33
- package/src/label.tsx +0 -39
- package/src/layout-panel-top.tsx +0 -160
- package/src/name-confirm-dialog.tsx +0 -153
- package/src/nav-float-button.tsx +0 -301
- package/src/notion-avatar.tsx +0 -126
- package/src/placeholder-page.tsx +0 -42
- package/src/popover.tsx +0 -106
- package/src/reference-inline.tsx +0 -53
- package/src/reference-search.tsx +0 -52
- package/src/resizable.tsx +0 -67
- package/src/select.tsx +0 -207
- package/src/separator.tsx +0 -45
- package/src/sheet.tsx +0 -164
- package/src/sidebar.tsx +0 -708
- package/src/skeleton.tsx +0 -30
- package/src/sonner.tsx +0 -37
- package/src/switch.tsx +0 -48
- package/src/textarea.tsx +0 -35
- package/src/timezone-provider.tsx +0 -55
- package/src/tooltip.tsx +0 -72
- package/src/use-mobile.ts +0 -36
- package/src/user-avatar.tsx +0 -79
- package/src/utils.ts +0 -6
package/src/button.tsx
DELETED
|
@@ -1,84 +0,0 @@
|
|
|
1
|
-
// SPDX-License-Identifier: AGPL-3.0-or-later
|
|
2
|
-
// AllBlue - 理想之海
|
|
3
|
-
// Copyright (C) 2026 AllBlue Contributors
|
|
4
|
-
//
|
|
5
|
-
// This program is free software: you can redistribute it and/or modify
|
|
6
|
-
// it under the terms of the GNU Affero General Public License as published by
|
|
7
|
-
// the Free Software Foundation, either version 3 of the License, or
|
|
8
|
-
// (at your option) any later version.
|
|
9
|
-
//
|
|
10
|
-
// This program is distributed in the hope that it will be useful,
|
|
11
|
-
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
12
|
-
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
13
|
-
// GNU Affero General Public License for more details.
|
|
14
|
-
//
|
|
15
|
-
// You should have received a copy of the GNU Affero General Public License
|
|
16
|
-
// along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
17
|
-
|
|
18
|
-
import * as React from "react"
|
|
19
|
-
import { cva, type VariantProps } from "class-variance-authority"
|
|
20
|
-
import { Slot } from "radix-ui"
|
|
21
|
-
|
|
22
|
-
import { cn } from "./utils"
|
|
23
|
-
|
|
24
|
-
const buttonVariants = cva(
|
|
25
|
-
"group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
26
|
-
{
|
|
27
|
-
variants: {
|
|
28
|
-
variant: {
|
|
29
|
-
default: "bg-primary text-primary-foreground hover:bg-primary/80",
|
|
30
|
-
outline:
|
|
31
|
-
"border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
|
|
32
|
-
secondary:
|
|
33
|
-
"bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
|
|
34
|
-
ghost:
|
|
35
|
-
"hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
|
|
36
|
-
destructive:
|
|
37
|
-
"bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
|
|
38
|
-
link: "text-primary underline-offset-4 hover:underline",
|
|
39
|
-
},
|
|
40
|
-
size: {
|
|
41
|
-
default:
|
|
42
|
-
"h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
|
|
43
|
-
xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
|
|
44
|
-
sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
|
|
45
|
-
lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
|
|
46
|
-
icon: "size-8",
|
|
47
|
-
"icon-xs":
|
|
48
|
-
"size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
|
|
49
|
-
"icon-sm":
|
|
50
|
-
"size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
|
|
51
|
-
"icon-lg": "size-9",
|
|
52
|
-
},
|
|
53
|
-
},
|
|
54
|
-
defaultVariants: {
|
|
55
|
-
variant: "default",
|
|
56
|
-
size: "default",
|
|
57
|
-
},
|
|
58
|
-
}
|
|
59
|
-
)
|
|
60
|
-
|
|
61
|
-
function Button({
|
|
62
|
-
className,
|
|
63
|
-
variant = "default",
|
|
64
|
-
size = "default",
|
|
65
|
-
asChild = false,
|
|
66
|
-
...props
|
|
67
|
-
}: React.ComponentProps<"button"> &
|
|
68
|
-
VariantProps<typeof buttonVariants> & {
|
|
69
|
-
asChild?: boolean
|
|
70
|
-
}) {
|
|
71
|
-
const Comp = asChild ? Slot.Root : "button"
|
|
72
|
-
|
|
73
|
-
return (
|
|
74
|
-
<Comp
|
|
75
|
-
data-slot="button"
|
|
76
|
-
data-variant={variant}
|
|
77
|
-
data-size={size}
|
|
78
|
-
className={cn(buttonVariants({ variant, size, className }))}
|
|
79
|
-
{...props}
|
|
80
|
-
/>
|
|
81
|
-
)
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
export { Button, buttonVariants }
|
package/src/card.tsx
DELETED
|
@@ -1,120 +0,0 @@
|
|
|
1
|
-
// SPDX-License-Identifier: AGPL-3.0-or-later
|
|
2
|
-
// AllBlue - 理想之海
|
|
3
|
-
// Copyright (C) 2026 AllBlue Contributors
|
|
4
|
-
//
|
|
5
|
-
// This program is free software: you can redistribute it and/or modify
|
|
6
|
-
// it under the terms of the GNU Affero General Public License as published by
|
|
7
|
-
// the Free Software Foundation, either version 3 of the License, or
|
|
8
|
-
// (at your option) any later version.
|
|
9
|
-
//
|
|
10
|
-
// This program is distributed in the hope that it will be useful,
|
|
11
|
-
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
12
|
-
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
13
|
-
// GNU Affero General Public License for more details.
|
|
14
|
-
//
|
|
15
|
-
// You should have received a copy of the GNU Affero General Public License
|
|
16
|
-
// along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
17
|
-
|
|
18
|
-
import * as React from "react"
|
|
19
|
-
|
|
20
|
-
import { cn } from "./utils"
|
|
21
|
-
|
|
22
|
-
function Card({
|
|
23
|
-
className,
|
|
24
|
-
size = "default",
|
|
25
|
-
...props
|
|
26
|
-
}: React.ComponentProps<"div"> & { size?: "default" | "sm" }) {
|
|
27
|
-
return (
|
|
28
|
-
<div
|
|
29
|
-
data-slot="card"
|
|
30
|
-
data-size={size}
|
|
31
|
-
className={cn(
|
|
32
|
-
"group/card flex flex-col gap-(--card-spacing) overflow-hidden rounded-xl bg-card py-(--card-spacing) text-sm text-card-foreground ring-1 ring-foreground/10 [--card-spacing:--spacing(4)] has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:[--card-spacing:--spacing(3)] data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl",
|
|
33
|
-
className
|
|
34
|
-
)}
|
|
35
|
-
{...props}
|
|
36
|
-
/>
|
|
37
|
-
)
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
|
|
41
|
-
return (
|
|
42
|
-
<div
|
|
43
|
-
data-slot="card-header"
|
|
44
|
-
className={cn(
|
|
45
|
-
"group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-(--card-spacing) has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-(--card-spacing)",
|
|
46
|
-
className
|
|
47
|
-
)}
|
|
48
|
-
{...props}
|
|
49
|
-
/>
|
|
50
|
-
)
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
|
|
54
|
-
return (
|
|
55
|
-
<div
|
|
56
|
-
data-slot="card-title"
|
|
57
|
-
className={cn(
|
|
58
|
-
"font-heading text-base leading-snug font-medium group-data-[size=sm]/card:text-sm",
|
|
59
|
-
className
|
|
60
|
-
)}
|
|
61
|
-
{...props}
|
|
62
|
-
/>
|
|
63
|
-
)
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
|
|
67
|
-
return (
|
|
68
|
-
<div
|
|
69
|
-
data-slot="card-description"
|
|
70
|
-
className={cn("text-sm text-muted-foreground", className)}
|
|
71
|
-
{...props}
|
|
72
|
-
/>
|
|
73
|
-
)
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
function CardAction({ className, ...props }: React.ComponentProps<"div">) {
|
|
77
|
-
return (
|
|
78
|
-
<div
|
|
79
|
-
data-slot="card-action"
|
|
80
|
-
className={cn(
|
|
81
|
-
"col-start-2 row-span-2 row-start-1 self-start justify-self-end",
|
|
82
|
-
className
|
|
83
|
-
)}
|
|
84
|
-
{...props}
|
|
85
|
-
/>
|
|
86
|
-
)
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
function CardContent({ className, ...props }: React.ComponentProps<"div">) {
|
|
90
|
-
return (
|
|
91
|
-
<div
|
|
92
|
-
data-slot="card-content"
|
|
93
|
-
className={cn("px-(--card-spacing)", className)}
|
|
94
|
-
{...props}
|
|
95
|
-
/>
|
|
96
|
-
)
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
|
|
100
|
-
return (
|
|
101
|
-
<div
|
|
102
|
-
data-slot="card-footer"
|
|
103
|
-
className={cn(
|
|
104
|
-
"flex items-center rounded-b-xl border-t bg-muted/50 p-(--card-spacing)",
|
|
105
|
-
className
|
|
106
|
-
)}
|
|
107
|
-
{...props}
|
|
108
|
-
/>
|
|
109
|
-
)
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
export {
|
|
113
|
-
Card,
|
|
114
|
-
CardHeader,
|
|
115
|
-
CardFooter,
|
|
116
|
-
CardTitle,
|
|
117
|
-
CardAction,
|
|
118
|
-
CardDescription,
|
|
119
|
-
CardContent,
|
|
120
|
-
}
|
package/src/checkbox.tsx
DELETED
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
// SPDX-License-Identifier: AGPL-3.0-or-later
|
|
2
|
-
// AllBlue - 理想之海
|
|
3
|
-
// Copyright (C) 2026 AllBlue Contributors
|
|
4
|
-
//
|
|
5
|
-
// This program is free software: you can redistribute it and/or modify
|
|
6
|
-
// it under the terms of the GNU Affero General Public License as published by
|
|
7
|
-
// the Free Software Foundation, either version 3 of the License, or
|
|
8
|
-
// (at your option) any later version.
|
|
9
|
-
//
|
|
10
|
-
// This program is distributed in the hope that it will be useful,
|
|
11
|
-
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
12
|
-
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
13
|
-
// GNU Affero General Public License for more details.
|
|
14
|
-
//
|
|
15
|
-
// You should have received a copy of the GNU Affero General Public License
|
|
16
|
-
// along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
17
|
-
|
|
18
|
-
import * as React from "react"
|
|
19
|
-
import { Checkbox as CheckboxPrimitive } from "radix-ui"
|
|
20
|
-
|
|
21
|
-
import { cn } from "./utils"
|
|
22
|
-
import { CheckIcon, MinusIcon } from "lucide-react"
|
|
23
|
-
|
|
24
|
-
function Checkbox({
|
|
25
|
-
className,
|
|
26
|
-
checked,
|
|
27
|
-
...props
|
|
28
|
-
}: React.ComponentProps<typeof CheckboxPrimitive.Root>) {
|
|
29
|
-
const indeterminate = checked === "indeterminate"
|
|
30
|
-
return (
|
|
31
|
-
<CheckboxPrimitive.Root
|
|
32
|
-
data-slot="checkbox"
|
|
33
|
-
className={cn(
|
|
34
|
-
"peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border border-input transition-colors outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 aria-invalid:aria-checked:border-primary dark:border-primary/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground data-[state=indeterminate]:border-primary data-[state=indeterminate]:bg-primary data-[state=indeterminate]:text-primary-foreground",
|
|
35
|
-
className
|
|
36
|
-
)}
|
|
37
|
-
checked={checked}
|
|
38
|
-
{...props}
|
|
39
|
-
>
|
|
40
|
-
<CheckboxPrimitive.Indicator
|
|
41
|
-
data-slot="checkbox-indicator"
|
|
42
|
-
className="grid place-content-center text-current transition-none [&>svg]:size-3.5"
|
|
43
|
-
>
|
|
44
|
-
{indeterminate ? <MinusIcon /> : <CheckIcon />}
|
|
45
|
-
</CheckboxPrimitive.Indicator>
|
|
46
|
-
</CheckboxPrimitive.Root>
|
|
47
|
-
)
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
export { Checkbox }
|
package/src/context-menu.tsx
DELETED
|
@@ -1,280 +0,0 @@
|
|
|
1
|
-
// SPDX-License-Identifier: AGPL-3.0-or-later
|
|
2
|
-
// AllBlue - 理想之海
|
|
3
|
-
// Copyright (C) 2026 AllBlue Contributors
|
|
4
|
-
//
|
|
5
|
-
// This program is free software: you can redistribute it and/or modify
|
|
6
|
-
// it under the terms of the GNU Affero General Public License as published by
|
|
7
|
-
// the Free Software Foundation, either version 3 of the License, or
|
|
8
|
-
// (at your option) any later version.
|
|
9
|
-
//
|
|
10
|
-
// This program is distributed in the hope that it will be useful,
|
|
11
|
-
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
12
|
-
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
13
|
-
// GNU Affero General Public License for more details.
|
|
14
|
-
//
|
|
15
|
-
// You should have received a copy of the GNU Affero General Public License
|
|
16
|
-
// along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
17
|
-
|
|
18
|
-
"use client"
|
|
19
|
-
|
|
20
|
-
import * as React from "react"
|
|
21
|
-
import { ContextMenu as ContextMenuPrimitive } from "radix-ui"
|
|
22
|
-
|
|
23
|
-
import { cn } from "./utils"
|
|
24
|
-
import { ChevronRightIcon, CheckIcon } from "lucide-react"
|
|
25
|
-
|
|
26
|
-
function ContextMenu({
|
|
27
|
-
...props
|
|
28
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.Root>) {
|
|
29
|
-
return <ContextMenuPrimitive.Root data-slot="context-menu" {...props} />
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
function ContextMenuTrigger({
|
|
33
|
-
className,
|
|
34
|
-
...props
|
|
35
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.Trigger>) {
|
|
36
|
-
return (
|
|
37
|
-
<ContextMenuPrimitive.Trigger
|
|
38
|
-
data-slot="context-menu-trigger"
|
|
39
|
-
className={cn("select-none", className)}
|
|
40
|
-
{...props}
|
|
41
|
-
/>
|
|
42
|
-
)
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
function ContextMenuGroup({
|
|
46
|
-
...props
|
|
47
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.Group>) {
|
|
48
|
-
return (
|
|
49
|
-
<ContextMenuPrimitive.Group data-slot="context-menu-group" {...props} />
|
|
50
|
-
)
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
function ContextMenuPortal({
|
|
54
|
-
...props
|
|
55
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.Portal>) {
|
|
56
|
-
return (
|
|
57
|
-
<ContextMenuPrimitive.Portal data-slot="context-menu-portal" {...props} />
|
|
58
|
-
)
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
function ContextMenuSub({
|
|
62
|
-
...props
|
|
63
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.Sub>) {
|
|
64
|
-
return <ContextMenuPrimitive.Sub data-slot="context-menu-sub" {...props} />
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
function ContextMenuRadioGroup({
|
|
68
|
-
...props
|
|
69
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.RadioGroup>) {
|
|
70
|
-
return (
|
|
71
|
-
<ContextMenuPrimitive.RadioGroup
|
|
72
|
-
data-slot="context-menu-radio-group"
|
|
73
|
-
{...props}
|
|
74
|
-
/>
|
|
75
|
-
)
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
function ContextMenuContent({
|
|
79
|
-
className,
|
|
80
|
-
...props
|
|
81
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.Content> & {
|
|
82
|
-
side?: "top" | "right" | "bottom" | "left"
|
|
83
|
-
}) {
|
|
84
|
-
return (
|
|
85
|
-
<ContextMenuPrimitive.Portal>
|
|
86
|
-
<ContextMenuPrimitive.Content
|
|
87
|
-
data-slot="context-menu-content"
|
|
88
|
-
className={cn("z-50 max-h-(--radix-context-menu-content-available-height) min-w-36 origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover p-1 text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 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 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className )}
|
|
89
|
-
{...props}
|
|
90
|
-
/>
|
|
91
|
-
</ContextMenuPrimitive.Portal>
|
|
92
|
-
)
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
function ContextMenuItem({
|
|
96
|
-
className,
|
|
97
|
-
inset,
|
|
98
|
-
variant = "default",
|
|
99
|
-
...props
|
|
100
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.Item> & {
|
|
101
|
-
inset?: boolean
|
|
102
|
-
variant?: "default" | "destructive"
|
|
103
|
-
}) {
|
|
104
|
-
return (
|
|
105
|
-
<ContextMenuPrimitive.Item
|
|
106
|
-
data-slot="context-menu-item"
|
|
107
|
-
data-inset={inset}
|
|
108
|
-
data-variant={variant}
|
|
109
|
-
className={cn(
|
|
110
|
-
"group/context-menu-item relative flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 focus:*:[svg]:text-accent-foreground data-[variant=destructive]:*:[svg]:text-destructive",
|
|
111
|
-
className
|
|
112
|
-
)}
|
|
113
|
-
{...props}
|
|
114
|
-
/>
|
|
115
|
-
)
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
function ContextMenuSubTrigger({
|
|
119
|
-
className,
|
|
120
|
-
inset,
|
|
121
|
-
children,
|
|
122
|
-
...props
|
|
123
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.SubTrigger> & {
|
|
124
|
-
inset?: boolean
|
|
125
|
-
}) {
|
|
126
|
-
return (
|
|
127
|
-
<ContextMenuPrimitive.SubTrigger
|
|
128
|
-
data-slot="context-menu-sub-trigger"
|
|
129
|
-
data-inset={inset}
|
|
130
|
-
className={cn(
|
|
131
|
-
"flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-open:bg-accent data-open:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
132
|
-
className
|
|
133
|
-
)}
|
|
134
|
-
{...props}
|
|
135
|
-
>
|
|
136
|
-
{children}
|
|
137
|
-
<ChevronRightIcon className="ml-auto" />
|
|
138
|
-
</ContextMenuPrimitive.SubTrigger>
|
|
139
|
-
)
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
function ContextMenuSubContent({
|
|
143
|
-
className,
|
|
144
|
-
...props
|
|
145
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.SubContent>) {
|
|
146
|
-
return (
|
|
147
|
-
<ContextMenuPrimitive.SubContent
|
|
148
|
-
data-slot="context-menu-sub-content"
|
|
149
|
-
className={cn("z-50 min-w-32 origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-lg border bg-popover p-1 text-popover-foreground shadow-lg duration-100 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 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className )}
|
|
150
|
-
{...props}
|
|
151
|
-
/>
|
|
152
|
-
)
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
function ContextMenuCheckboxItem({
|
|
156
|
-
className,
|
|
157
|
-
children,
|
|
158
|
-
checked,
|
|
159
|
-
inset,
|
|
160
|
-
...props
|
|
161
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.CheckboxItem> & {
|
|
162
|
-
inset?: boolean
|
|
163
|
-
}) {
|
|
164
|
-
return (
|
|
165
|
-
<ContextMenuPrimitive.CheckboxItem
|
|
166
|
-
data-slot="context-menu-checkbox-item"
|
|
167
|
-
data-inset={inset}
|
|
168
|
-
className={cn(
|
|
169
|
-
"relative flex cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
170
|
-
className
|
|
171
|
-
)}
|
|
172
|
-
checked={checked}
|
|
173
|
-
{...props}
|
|
174
|
-
>
|
|
175
|
-
<span className="pointer-events-none absolute right-2">
|
|
176
|
-
<ContextMenuPrimitive.ItemIndicator>
|
|
177
|
-
<CheckIcon
|
|
178
|
-
/>
|
|
179
|
-
</ContextMenuPrimitive.ItemIndicator>
|
|
180
|
-
</span>
|
|
181
|
-
{children}
|
|
182
|
-
</ContextMenuPrimitive.CheckboxItem>
|
|
183
|
-
)
|
|
184
|
-
}
|
|
185
|
-
|
|
186
|
-
function ContextMenuRadioItem({
|
|
187
|
-
className,
|
|
188
|
-
children,
|
|
189
|
-
inset,
|
|
190
|
-
...props
|
|
191
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.RadioItem> & {
|
|
192
|
-
inset?: boolean
|
|
193
|
-
}) {
|
|
194
|
-
return (
|
|
195
|
-
<ContextMenuPrimitive.RadioItem
|
|
196
|
-
data-slot="context-menu-radio-item"
|
|
197
|
-
data-inset={inset}
|
|
198
|
-
className={cn(
|
|
199
|
-
"relative flex cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
200
|
-
className
|
|
201
|
-
)}
|
|
202
|
-
{...props}
|
|
203
|
-
>
|
|
204
|
-
<span className="pointer-events-none absolute right-2">
|
|
205
|
-
<ContextMenuPrimitive.ItemIndicator>
|
|
206
|
-
<CheckIcon
|
|
207
|
-
/>
|
|
208
|
-
</ContextMenuPrimitive.ItemIndicator>
|
|
209
|
-
</span>
|
|
210
|
-
{children}
|
|
211
|
-
</ContextMenuPrimitive.RadioItem>
|
|
212
|
-
)
|
|
213
|
-
}
|
|
214
|
-
|
|
215
|
-
function ContextMenuLabel({
|
|
216
|
-
className,
|
|
217
|
-
inset,
|
|
218
|
-
...props
|
|
219
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.Label> & {
|
|
220
|
-
inset?: boolean
|
|
221
|
-
}) {
|
|
222
|
-
return (
|
|
223
|
-
<ContextMenuPrimitive.Label
|
|
224
|
-
data-slot="context-menu-label"
|
|
225
|
-
data-inset={inset}
|
|
226
|
-
className={cn(
|
|
227
|
-
"px-1.5 py-1 text-xs font-medium text-muted-foreground data-inset:pl-7",
|
|
228
|
-
className
|
|
229
|
-
)}
|
|
230
|
-
{...props}
|
|
231
|
-
/>
|
|
232
|
-
)
|
|
233
|
-
}
|
|
234
|
-
|
|
235
|
-
function ContextMenuSeparator({
|
|
236
|
-
className,
|
|
237
|
-
...props
|
|
238
|
-
}: React.ComponentProps<typeof ContextMenuPrimitive.Separator>) {
|
|
239
|
-
return (
|
|
240
|
-
<ContextMenuPrimitive.Separator
|
|
241
|
-
data-slot="context-menu-separator"
|
|
242
|
-
className={cn("-mx-1 my-1 h-px bg-border", className)}
|
|
243
|
-
{...props}
|
|
244
|
-
/>
|
|
245
|
-
)
|
|
246
|
-
}
|
|
247
|
-
|
|
248
|
-
function ContextMenuShortcut({
|
|
249
|
-
className,
|
|
250
|
-
...props
|
|
251
|
-
}: React.ComponentProps<"span">) {
|
|
252
|
-
return (
|
|
253
|
-
<span
|
|
254
|
-
data-slot="context-menu-shortcut"
|
|
255
|
-
className={cn(
|
|
256
|
-
"ml-auto text-xs tracking-widest text-muted-foreground group-focus/context-menu-item:text-accent-foreground",
|
|
257
|
-
className
|
|
258
|
-
)}
|
|
259
|
-
{...props}
|
|
260
|
-
/>
|
|
261
|
-
)
|
|
262
|
-
}
|
|
263
|
-
|
|
264
|
-
export {
|
|
265
|
-
ContextMenu,
|
|
266
|
-
ContextMenuTrigger,
|
|
267
|
-
ContextMenuContent,
|
|
268
|
-
ContextMenuItem,
|
|
269
|
-
ContextMenuCheckboxItem,
|
|
270
|
-
ContextMenuRadioItem,
|
|
271
|
-
ContextMenuLabel,
|
|
272
|
-
ContextMenuSeparator,
|
|
273
|
-
ContextMenuShortcut,
|
|
274
|
-
ContextMenuGroup,
|
|
275
|
-
ContextMenuPortal,
|
|
276
|
-
ContextMenuSub,
|
|
277
|
-
ContextMenuSubContent,
|
|
278
|
-
ContextMenuSubTrigger,
|
|
279
|
-
ContextMenuRadioGroup,
|
|
280
|
-
}
|