@tanstack/cta-ui 0.15.3 → 0.15.5
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/assets/index-BLGJkAxX.css +1 -0
- package/dist/assets/index-DPjMQkKx.js +208 -0
- package/dist/assets/index-DPjMQkKx.js.map +1 -0
- package/dist/index.html +3 -2
- package/index.html +1 -0
- package/lib/engine-handling/create-app-wrapper.ts +3 -4
- package/lib/engine-handling/generate-initial-payload.ts +12 -20
- package/lib/engine-handling/server-environment.ts +2 -2
- package/lib/index.ts +33 -15
- package/lib-dist/engine-handling/create-app-wrapper.js +3 -2
- package/lib-dist/engine-handling/generate-initial-payload.d.ts +8 -6
- package/lib-dist/engine-handling/generate-initial-payload.js +9 -14
- package/lib-dist/engine-handling/server-environment.d.ts +3 -3
- package/lib-dist/index.d.ts +1 -0
- package/lib-dist/index.js +29 -11
- package/package.json +3 -32
- package/src/index.tsx +2 -42
- package/src/main.tsx +0 -1
- package/src/styles.css +2 -0
- package/src/types.d.ts +13 -8
- package/dist/assets/index-BktnQA5a.js +0 -213
- package/dist/assets/index-BktnQA5a.js.map +0 -1
- package/dist/assets/index-CpoUtYXp.css +0 -1
- package/dist/logo-color-100w.png +0 -0
- package/dist/logo192.png +0 -0
- package/dist/logo512.png +0 -0
- package/dist/tailwind.svg +0 -1
- package/dist/tanstack.png +0 -0
- package/dist/typescript.svg +0 -1
- package/lib/engine-handling/framework-registration.ts +0 -11
- package/lib-dist/engine-handling/framework-registration.d.ts +0 -1
- package/lib-dist/engine-handling/framework-registration.js +0 -10
- package/public/logo-color-100w.png +0 -0
- package/public/logo192.png +0 -0
- package/public/logo512.png +0 -0
- package/public/tailwind.svg +0 -1
- package/public/tanstack.png +0 -0
- package/public/typescript.svg +0 -1
- package/src/components/StatusList.tsx +0 -22
- package/src/components/add-on-info-dialog.tsx +0 -39
- package/src/components/background-animation.tsx +0 -229
- package/src/components/cta-sidebar.tsx +0 -50
- package/src/components/custom-add-on-dialog.tsx +0 -79
- package/src/components/file-navigator.tsx +0 -203
- package/src/components/file-tree.tsx +0 -35
- package/src/components/file-viewer.tsx +0 -67
- package/src/components/header.tsx +0 -31
- package/src/components/sidebar-items/add-ons.tsx +0 -94
- package/src/components/sidebar-items/mode-selector.tsx +0 -57
- package/src/components/sidebar-items/project-name.tsx +0 -28
- package/src/components/sidebar-items/run-add-ons.tsx +0 -71
- package/src/components/sidebar-items/run-create-app.tsx +0 -82
- package/src/components/sidebar-items/starter.tsx +0 -123
- package/src/components/sidebar-items/typescript-switch.tsx +0 -52
- package/src/components/starters-carousel.tsx +0 -45
- package/src/components/startup-dialog.tsx +0 -71
- package/src/components/toaster.tsx +0 -29
- package/src/components/ui/button.tsx +0 -61
- package/src/components/ui/carousel.tsx +0 -239
- package/src/components/ui/checkbox.tsx +0 -30
- package/src/components/ui/dialog.tsx +0 -138
- package/src/components/ui/dropdown-menu.tsx +0 -255
- package/src/components/ui/input.tsx +0 -21
- package/src/components/ui/label.tsx +0 -22
- package/src/components/ui/popover.tsx +0 -46
- package/src/components/ui/separator.tsx +0 -28
- package/src/components/ui/sheet.tsx +0 -137
- package/src/components/ui/sidebar.tsx +0 -726
- package/src/components/ui/skeleton.tsx +0 -13
- package/src/components/ui/sonner.tsx +0 -23
- package/src/components/ui/switch.tsx +0 -29
- package/src/components/ui/table.tsx +0 -114
- package/src/components/ui/tabs.tsx +0 -64
- package/src/components/ui/toggle-group.tsx +0 -71
- package/src/components/ui/toggle.tsx +0 -49
- package/src/components/ui/tooltip.tsx +0 -61
- package/src/components/ui/tree-view.tsx +0 -497
- package/src/file-classes.ts +0 -54
- package/src/hooks/use-mobile.ts +0 -19
- package/src/hooks/use-mounted.ts +0 -9
- package/src/hooks/use-preferred-reduced-motion.ts +0 -27
- package/src/hooks/use-streaming-status.ts +0 -70
- package/src/lib/api.ts +0 -92
- package/src/lib/utils.ts +0 -6
- package/src/store/add-ons.ts +0 -81
- package/src/store/project.ts +0 -347
- package/tests/store/add-ons.test.ts +0 -222
- package/vitest.config.ts +0 -6
|
@@ -1,138 +0,0 @@
|
|
|
1
|
-
import * as React from 'react'
|
|
2
|
-
import * as DialogPrimitive from '@radix-ui/react-dialog'
|
|
3
|
-
import { XIcon } from 'lucide-react'
|
|
4
|
-
|
|
5
|
-
import { cn } from '@/lib/utils'
|
|
6
|
-
|
|
7
|
-
function Dialog({
|
|
8
|
-
...props
|
|
9
|
-
}: React.ComponentProps<typeof DialogPrimitive.Root>) {
|
|
10
|
-
return <DialogPrimitive.Root data-slot="dialog" {...props} />
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
function DialogTrigger({
|
|
14
|
-
...props
|
|
15
|
-
}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {
|
|
16
|
-
return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
function DialogPortal({
|
|
20
|
-
...props
|
|
21
|
-
}: React.ComponentProps<typeof DialogPrimitive.Portal>) {
|
|
22
|
-
return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
function DialogClose({
|
|
26
|
-
...props
|
|
27
|
-
}: React.ComponentProps<typeof DialogPrimitive.Close>) {
|
|
28
|
-
return <DialogPrimitive.Close data-slot="dialog-close" {...props} />
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
function DialogOverlay({
|
|
32
|
-
className,
|
|
33
|
-
...props
|
|
34
|
-
}: React.ComponentProps<typeof DialogPrimitive.Overlay>) {
|
|
35
|
-
return (
|
|
36
|
-
<DialogPrimitive.Overlay
|
|
37
|
-
data-slot="dialog-overlay"
|
|
38
|
-
className={cn(
|
|
39
|
-
'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50',
|
|
40
|
-
className,
|
|
41
|
-
)}
|
|
42
|
-
{...props}
|
|
43
|
-
/>
|
|
44
|
-
)
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
function DialogContent({
|
|
48
|
-
className,
|
|
49
|
-
children,
|
|
50
|
-
hideCloseButton,
|
|
51
|
-
...props
|
|
52
|
-
}: React.ComponentProps<typeof DialogPrimitive.Content> & {
|
|
53
|
-
hideCloseButton?: boolean
|
|
54
|
-
}) {
|
|
55
|
-
return (
|
|
56
|
-
<DialogPortal data-slot="dialog-portal">
|
|
57
|
-
<DialogOverlay />
|
|
58
|
-
<DialogPrimitive.Content
|
|
59
|
-
data-slot="dialog-content"
|
|
60
|
-
className={cn(
|
|
61
|
-
'bg-background 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 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg p-6 shadow-lg duration-200 sm:max-w-lg bg-opacity-70 backdrop-blur-md border-3 border-white/20',
|
|
62
|
-
className,
|
|
63
|
-
)}
|
|
64
|
-
{...props}
|
|
65
|
-
>
|
|
66
|
-
{children}
|
|
67
|
-
{!hideCloseButton && (
|
|
68
|
-
<DialogPrimitive.Close className="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4">
|
|
69
|
-
<XIcon />
|
|
70
|
-
<span className="sr-only">Close</span>
|
|
71
|
-
</DialogPrimitive.Close>
|
|
72
|
-
)}
|
|
73
|
-
</DialogPrimitive.Content>
|
|
74
|
-
</DialogPortal>
|
|
75
|
-
)
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
function DialogHeader({ className, ...props }: React.ComponentProps<'div'>) {
|
|
79
|
-
return (
|
|
80
|
-
<div
|
|
81
|
-
data-slot="dialog-header"
|
|
82
|
-
className={cn('flex flex-col gap-2 text-center sm:text-left', className)}
|
|
83
|
-
{...props}
|
|
84
|
-
/>
|
|
85
|
-
)
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
function DialogFooter({ className, ...props }: React.ComponentProps<'div'>) {
|
|
89
|
-
return (
|
|
90
|
-
<div
|
|
91
|
-
data-slot="dialog-footer"
|
|
92
|
-
className={cn(
|
|
93
|
-
'flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',
|
|
94
|
-
className,
|
|
95
|
-
)}
|
|
96
|
-
{...props}
|
|
97
|
-
/>
|
|
98
|
-
)
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
function DialogTitle({
|
|
102
|
-
className,
|
|
103
|
-
...props
|
|
104
|
-
}: React.ComponentProps<typeof DialogPrimitive.Title>) {
|
|
105
|
-
return (
|
|
106
|
-
<DialogPrimitive.Title
|
|
107
|
-
data-slot="dialog-title"
|
|
108
|
-
className={cn('text-lg leading-none font-semibold', className)}
|
|
109
|
-
{...props}
|
|
110
|
-
/>
|
|
111
|
-
)
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
function DialogDescription({
|
|
115
|
-
className,
|
|
116
|
-
...props
|
|
117
|
-
}: React.ComponentProps<typeof DialogPrimitive.Description>) {
|
|
118
|
-
return (
|
|
119
|
-
<DialogPrimitive.Description
|
|
120
|
-
data-slot="dialog-description"
|
|
121
|
-
className={cn('text-muted-foreground text-sm', className)}
|
|
122
|
-
{...props}
|
|
123
|
-
/>
|
|
124
|
-
)
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
export {
|
|
128
|
-
Dialog,
|
|
129
|
-
DialogClose,
|
|
130
|
-
DialogContent,
|
|
131
|
-
DialogDescription,
|
|
132
|
-
DialogFooter,
|
|
133
|
-
DialogHeader,
|
|
134
|
-
DialogOverlay,
|
|
135
|
-
DialogPortal,
|
|
136
|
-
DialogTitle,
|
|
137
|
-
DialogTrigger,
|
|
138
|
-
}
|
|
@@ -1,255 +0,0 @@
|
|
|
1
|
-
import * as React from "react"
|
|
2
|
-
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"
|
|
3
|
-
import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react"
|
|
4
|
-
|
|
5
|
-
import { cn } from "@/lib/utils"
|
|
6
|
-
|
|
7
|
-
function DropdownMenu({
|
|
8
|
-
...props
|
|
9
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {
|
|
10
|
-
return <DropdownMenuPrimitive.Root data-slot="dropdown-menu" {...props} />
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
function DropdownMenuPortal({
|
|
14
|
-
...props
|
|
15
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {
|
|
16
|
-
return (
|
|
17
|
-
<DropdownMenuPrimitive.Portal data-slot="dropdown-menu-portal" {...props} />
|
|
18
|
-
)
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
function DropdownMenuTrigger({
|
|
22
|
-
...props
|
|
23
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {
|
|
24
|
-
return (
|
|
25
|
-
<DropdownMenuPrimitive.Trigger
|
|
26
|
-
data-slot="dropdown-menu-trigger"
|
|
27
|
-
{...props}
|
|
28
|
-
/>
|
|
29
|
-
)
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
function DropdownMenuContent({
|
|
33
|
-
className,
|
|
34
|
-
sideOffset = 4,
|
|
35
|
-
...props
|
|
36
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {
|
|
37
|
-
return (
|
|
38
|
-
<DropdownMenuPrimitive.Portal>
|
|
39
|
-
<DropdownMenuPrimitive.Content
|
|
40
|
-
data-slot="dropdown-menu-content"
|
|
41
|
-
sideOffset={sideOffset}
|
|
42
|
-
className={cn(
|
|
43
|
-
"bg-popover text-popover-foreground 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 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
|
|
44
|
-
className
|
|
45
|
-
)}
|
|
46
|
-
{...props}
|
|
47
|
-
/>
|
|
48
|
-
</DropdownMenuPrimitive.Portal>
|
|
49
|
-
)
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
function DropdownMenuGroup({
|
|
53
|
-
...props
|
|
54
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {
|
|
55
|
-
return (
|
|
56
|
-
<DropdownMenuPrimitive.Group data-slot="dropdown-menu-group" {...props} />
|
|
57
|
-
)
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
function DropdownMenuItem({
|
|
61
|
-
className,
|
|
62
|
-
inset,
|
|
63
|
-
variant = "default",
|
|
64
|
-
...props
|
|
65
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
|
|
66
|
-
inset?: boolean
|
|
67
|
-
variant?: "default" | "destructive"
|
|
68
|
-
}) {
|
|
69
|
-
return (
|
|
70
|
-
<DropdownMenuPrimitive.Item
|
|
71
|
-
data-slot="dropdown-menu-item"
|
|
72
|
-
data-inset={inset}
|
|
73
|
-
data-variant={variant}
|
|
74
|
-
className={cn(
|
|
75
|
-
"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
76
|
-
className
|
|
77
|
-
)}
|
|
78
|
-
{...props}
|
|
79
|
-
/>
|
|
80
|
-
)
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
function DropdownMenuCheckboxItem({
|
|
84
|
-
className,
|
|
85
|
-
children,
|
|
86
|
-
checked,
|
|
87
|
-
...props
|
|
88
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>) {
|
|
89
|
-
return (
|
|
90
|
-
<DropdownMenuPrimitive.CheckboxItem
|
|
91
|
-
data-slot="dropdown-menu-checkbox-item"
|
|
92
|
-
className={cn(
|
|
93
|
-
"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
94
|
-
className
|
|
95
|
-
)}
|
|
96
|
-
checked={checked}
|
|
97
|
-
{...props}
|
|
98
|
-
>
|
|
99
|
-
<span className="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
|
|
100
|
-
<DropdownMenuPrimitive.ItemIndicator>
|
|
101
|
-
<CheckIcon className="size-4" />
|
|
102
|
-
</DropdownMenuPrimitive.ItemIndicator>
|
|
103
|
-
</span>
|
|
104
|
-
{children}
|
|
105
|
-
</DropdownMenuPrimitive.CheckboxItem>
|
|
106
|
-
)
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
function DropdownMenuRadioGroup({
|
|
110
|
-
...props
|
|
111
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>) {
|
|
112
|
-
return (
|
|
113
|
-
<DropdownMenuPrimitive.RadioGroup
|
|
114
|
-
data-slot="dropdown-menu-radio-group"
|
|
115
|
-
{...props}
|
|
116
|
-
/>
|
|
117
|
-
)
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
function DropdownMenuRadioItem({
|
|
121
|
-
className,
|
|
122
|
-
children,
|
|
123
|
-
...props
|
|
124
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>) {
|
|
125
|
-
return (
|
|
126
|
-
<DropdownMenuPrimitive.RadioItem
|
|
127
|
-
data-slot="dropdown-menu-radio-item"
|
|
128
|
-
className={cn(
|
|
129
|
-
"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
130
|
-
className
|
|
131
|
-
)}
|
|
132
|
-
{...props}
|
|
133
|
-
>
|
|
134
|
-
<span className="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
|
|
135
|
-
<DropdownMenuPrimitive.ItemIndicator>
|
|
136
|
-
<CircleIcon className="size-2 fill-current" />
|
|
137
|
-
</DropdownMenuPrimitive.ItemIndicator>
|
|
138
|
-
</span>
|
|
139
|
-
{children}
|
|
140
|
-
</DropdownMenuPrimitive.RadioItem>
|
|
141
|
-
)
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
function DropdownMenuLabel({
|
|
145
|
-
className,
|
|
146
|
-
inset,
|
|
147
|
-
...props
|
|
148
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {
|
|
149
|
-
inset?: boolean
|
|
150
|
-
}) {
|
|
151
|
-
return (
|
|
152
|
-
<DropdownMenuPrimitive.Label
|
|
153
|
-
data-slot="dropdown-menu-label"
|
|
154
|
-
data-inset={inset}
|
|
155
|
-
className={cn(
|
|
156
|
-
"px-2 py-1.5 text-sm font-medium data-[inset]:pl-8",
|
|
157
|
-
className
|
|
158
|
-
)}
|
|
159
|
-
{...props}
|
|
160
|
-
/>
|
|
161
|
-
)
|
|
162
|
-
}
|
|
163
|
-
|
|
164
|
-
function DropdownMenuSeparator({
|
|
165
|
-
className,
|
|
166
|
-
...props
|
|
167
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {
|
|
168
|
-
return (
|
|
169
|
-
<DropdownMenuPrimitive.Separator
|
|
170
|
-
data-slot="dropdown-menu-separator"
|
|
171
|
-
className={cn("bg-border -mx-1 my-1 h-px", className)}
|
|
172
|
-
{...props}
|
|
173
|
-
/>
|
|
174
|
-
)
|
|
175
|
-
}
|
|
176
|
-
|
|
177
|
-
function DropdownMenuShortcut({
|
|
178
|
-
className,
|
|
179
|
-
...props
|
|
180
|
-
}: React.ComponentProps<"span">) {
|
|
181
|
-
return (
|
|
182
|
-
<span
|
|
183
|
-
data-slot="dropdown-menu-shortcut"
|
|
184
|
-
className={cn(
|
|
185
|
-
"text-muted-foreground ml-auto text-xs tracking-widest",
|
|
186
|
-
className
|
|
187
|
-
)}
|
|
188
|
-
{...props}
|
|
189
|
-
/>
|
|
190
|
-
)
|
|
191
|
-
}
|
|
192
|
-
|
|
193
|
-
function DropdownMenuSub({
|
|
194
|
-
...props
|
|
195
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {
|
|
196
|
-
return <DropdownMenuPrimitive.Sub data-slot="dropdown-menu-sub" {...props} />
|
|
197
|
-
}
|
|
198
|
-
|
|
199
|
-
function DropdownMenuSubTrigger({
|
|
200
|
-
className,
|
|
201
|
-
inset,
|
|
202
|
-
children,
|
|
203
|
-
...props
|
|
204
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {
|
|
205
|
-
inset?: boolean
|
|
206
|
-
}) {
|
|
207
|
-
return (
|
|
208
|
-
<DropdownMenuPrimitive.SubTrigger
|
|
209
|
-
data-slot="dropdown-menu-sub-trigger"
|
|
210
|
-
data-inset={inset}
|
|
211
|
-
className={cn(
|
|
212
|
-
"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8",
|
|
213
|
-
className
|
|
214
|
-
)}
|
|
215
|
-
{...props}
|
|
216
|
-
>
|
|
217
|
-
{children}
|
|
218
|
-
<ChevronRightIcon className="ml-auto size-4" />
|
|
219
|
-
</DropdownMenuPrimitive.SubTrigger>
|
|
220
|
-
)
|
|
221
|
-
}
|
|
222
|
-
|
|
223
|
-
function DropdownMenuSubContent({
|
|
224
|
-
className,
|
|
225
|
-
...props
|
|
226
|
-
}: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>) {
|
|
227
|
-
return (
|
|
228
|
-
<DropdownMenuPrimitive.SubContent
|
|
229
|
-
data-slot="dropdown-menu-sub-content"
|
|
230
|
-
className={cn(
|
|
231
|
-
"bg-popover text-popover-foreground 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 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg",
|
|
232
|
-
className
|
|
233
|
-
)}
|
|
234
|
-
{...props}
|
|
235
|
-
/>
|
|
236
|
-
)
|
|
237
|
-
}
|
|
238
|
-
|
|
239
|
-
export {
|
|
240
|
-
DropdownMenu,
|
|
241
|
-
DropdownMenuPortal,
|
|
242
|
-
DropdownMenuTrigger,
|
|
243
|
-
DropdownMenuContent,
|
|
244
|
-
DropdownMenuGroup,
|
|
245
|
-
DropdownMenuLabel,
|
|
246
|
-
DropdownMenuItem,
|
|
247
|
-
DropdownMenuCheckboxItem,
|
|
248
|
-
DropdownMenuRadioGroup,
|
|
249
|
-
DropdownMenuRadioItem,
|
|
250
|
-
DropdownMenuSeparator,
|
|
251
|
-
DropdownMenuShortcut,
|
|
252
|
-
DropdownMenuSub,
|
|
253
|
-
DropdownMenuSubTrigger,
|
|
254
|
-
DropdownMenuSubContent,
|
|
255
|
-
}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import * as React from "react"
|
|
2
|
-
|
|
3
|
-
import { cn } from "@/lib/utils"
|
|
4
|
-
|
|
5
|
-
function Input({ className, type, ...props }: React.ComponentProps<"input">) {
|
|
6
|
-
return (
|
|
7
|
-
<input
|
|
8
|
-
type={type}
|
|
9
|
-
data-slot="input"
|
|
10
|
-
className={cn(
|
|
11
|
-
"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
|
|
12
|
-
"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
|
|
13
|
-
"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
14
|
-
className
|
|
15
|
-
)}
|
|
16
|
-
{...props}
|
|
17
|
-
/>
|
|
18
|
-
)
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
export { Input }
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import * as React from "react"
|
|
2
|
-
import * as LabelPrimitive from "@radix-ui/react-label"
|
|
3
|
-
|
|
4
|
-
import { cn } from "@/lib/utils"
|
|
5
|
-
|
|
6
|
-
function Label({
|
|
7
|
-
className,
|
|
8
|
-
...props
|
|
9
|
-
}: React.ComponentProps<typeof LabelPrimitive.Root>) {
|
|
10
|
-
return (
|
|
11
|
-
<LabelPrimitive.Root
|
|
12
|
-
data-slot="label"
|
|
13
|
-
className={cn(
|
|
14
|
-
"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
|
|
15
|
-
className
|
|
16
|
-
)}
|
|
17
|
-
{...props}
|
|
18
|
-
/>
|
|
19
|
-
)
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
export { Label }
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import * as React from "react"
|
|
2
|
-
import * as PopoverPrimitive from "@radix-ui/react-popover"
|
|
3
|
-
|
|
4
|
-
import { cn } from "@/lib/utils"
|
|
5
|
-
|
|
6
|
-
function Popover({
|
|
7
|
-
...props
|
|
8
|
-
}: React.ComponentProps<typeof PopoverPrimitive.Root>) {
|
|
9
|
-
return <PopoverPrimitive.Root data-slot="popover" {...props} />
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
function PopoverTrigger({
|
|
13
|
-
...props
|
|
14
|
-
}: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {
|
|
15
|
-
return <PopoverPrimitive.Trigger data-slot="popover-trigger" {...props} />
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
function PopoverContent({
|
|
19
|
-
className,
|
|
20
|
-
align = "center",
|
|
21
|
-
sideOffset = 4,
|
|
22
|
-
...props
|
|
23
|
-
}: React.ComponentProps<typeof PopoverPrimitive.Content>) {
|
|
24
|
-
return (
|
|
25
|
-
<PopoverPrimitive.Portal>
|
|
26
|
-
<PopoverPrimitive.Content
|
|
27
|
-
data-slot="popover-content"
|
|
28
|
-
align={align}
|
|
29
|
-
sideOffset={sideOffset}
|
|
30
|
-
className={cn(
|
|
31
|
-
"bg-popover text-popover-foreground 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 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
|
|
32
|
-
className
|
|
33
|
-
)}
|
|
34
|
-
{...props}
|
|
35
|
-
/>
|
|
36
|
-
</PopoverPrimitive.Portal>
|
|
37
|
-
)
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
function PopoverAnchor({
|
|
41
|
-
...props
|
|
42
|
-
}: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {
|
|
43
|
-
return <PopoverPrimitive.Anchor data-slot="popover-anchor" {...props} />
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor }
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
"use client"
|
|
2
|
-
|
|
3
|
-
import * as React from "react"
|
|
4
|
-
import * as SeparatorPrimitive from "@radix-ui/react-separator"
|
|
5
|
-
|
|
6
|
-
import { cn } from "@/lib/utils"
|
|
7
|
-
|
|
8
|
-
function Separator({
|
|
9
|
-
className,
|
|
10
|
-
orientation = "horizontal",
|
|
11
|
-
decorative = true,
|
|
12
|
-
...props
|
|
13
|
-
}: React.ComponentProps<typeof SeparatorPrimitive.Root>) {
|
|
14
|
-
return (
|
|
15
|
-
<SeparatorPrimitive.Root
|
|
16
|
-
data-slot="separator-root"
|
|
17
|
-
decorative={decorative}
|
|
18
|
-
orientation={orientation}
|
|
19
|
-
className={cn(
|
|
20
|
-
"bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
|
|
21
|
-
className
|
|
22
|
-
)}
|
|
23
|
-
{...props}
|
|
24
|
-
/>
|
|
25
|
-
)
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
export { Separator }
|
|
@@ -1,137 +0,0 @@
|
|
|
1
|
-
import * as React from "react"
|
|
2
|
-
import * as SheetPrimitive from "@radix-ui/react-dialog"
|
|
3
|
-
import { XIcon } from "lucide-react"
|
|
4
|
-
|
|
5
|
-
import { cn } from "@/lib/utils"
|
|
6
|
-
|
|
7
|
-
function Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {
|
|
8
|
-
return <SheetPrimitive.Root data-slot="sheet" {...props} />
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
function SheetTrigger({
|
|
12
|
-
...props
|
|
13
|
-
}: React.ComponentProps<typeof SheetPrimitive.Trigger>) {
|
|
14
|
-
return <SheetPrimitive.Trigger data-slot="sheet-trigger" {...props} />
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
function SheetClose({
|
|
18
|
-
...props
|
|
19
|
-
}: React.ComponentProps<typeof SheetPrimitive.Close>) {
|
|
20
|
-
return <SheetPrimitive.Close data-slot="sheet-close" {...props} />
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
function SheetPortal({
|
|
24
|
-
...props
|
|
25
|
-
}: React.ComponentProps<typeof SheetPrimitive.Portal>) {
|
|
26
|
-
return <SheetPrimitive.Portal data-slot="sheet-portal" {...props} />
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
function SheetOverlay({
|
|
30
|
-
className,
|
|
31
|
-
...props
|
|
32
|
-
}: React.ComponentProps<typeof SheetPrimitive.Overlay>) {
|
|
33
|
-
return (
|
|
34
|
-
<SheetPrimitive.Overlay
|
|
35
|
-
data-slot="sheet-overlay"
|
|
36
|
-
className={cn(
|
|
37
|
-
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
|
|
38
|
-
className
|
|
39
|
-
)}
|
|
40
|
-
{...props}
|
|
41
|
-
/>
|
|
42
|
-
)
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
function SheetContent({
|
|
46
|
-
className,
|
|
47
|
-
children,
|
|
48
|
-
side = "right",
|
|
49
|
-
...props
|
|
50
|
-
}: React.ComponentProps<typeof SheetPrimitive.Content> & {
|
|
51
|
-
side?: "top" | "right" | "bottom" | "left"
|
|
52
|
-
}) {
|
|
53
|
-
return (
|
|
54
|
-
<SheetPortal>
|
|
55
|
-
<SheetOverlay />
|
|
56
|
-
<SheetPrimitive.Content
|
|
57
|
-
data-slot="sheet-content"
|
|
58
|
-
className={cn(
|
|
59
|
-
"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
|
|
60
|
-
side === "right" &&
|
|
61
|
-
"data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
|
|
62
|
-
side === "left" &&
|
|
63
|
-
"data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm",
|
|
64
|
-
side === "top" &&
|
|
65
|
-
"data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b",
|
|
66
|
-
side === "bottom" &&
|
|
67
|
-
"data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t",
|
|
68
|
-
className
|
|
69
|
-
)}
|
|
70
|
-
{...props}
|
|
71
|
-
>
|
|
72
|
-
{children}
|
|
73
|
-
<SheetPrimitive.Close className="ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none">
|
|
74
|
-
<XIcon className="size-4" />
|
|
75
|
-
<span className="sr-only">Close</span>
|
|
76
|
-
</SheetPrimitive.Close>
|
|
77
|
-
</SheetPrimitive.Content>
|
|
78
|
-
</SheetPortal>
|
|
79
|
-
)
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
function SheetHeader({ className, ...props }: React.ComponentProps<"div">) {
|
|
83
|
-
return (
|
|
84
|
-
<div
|
|
85
|
-
data-slot="sheet-header"
|
|
86
|
-
className={cn("flex flex-col gap-1.5 p-4", className)}
|
|
87
|
-
{...props}
|
|
88
|
-
/>
|
|
89
|
-
)
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
function SheetFooter({ className, ...props }: React.ComponentProps<"div">) {
|
|
93
|
-
return (
|
|
94
|
-
<div
|
|
95
|
-
data-slot="sheet-footer"
|
|
96
|
-
className={cn("mt-auto flex flex-col gap-2 p-4", className)}
|
|
97
|
-
{...props}
|
|
98
|
-
/>
|
|
99
|
-
)
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
function SheetTitle({
|
|
103
|
-
className,
|
|
104
|
-
...props
|
|
105
|
-
}: React.ComponentProps<typeof SheetPrimitive.Title>) {
|
|
106
|
-
return (
|
|
107
|
-
<SheetPrimitive.Title
|
|
108
|
-
data-slot="sheet-title"
|
|
109
|
-
className={cn("text-foreground font-semibold", className)}
|
|
110
|
-
{...props}
|
|
111
|
-
/>
|
|
112
|
-
)
|
|
113
|
-
}
|
|
114
|
-
|
|
115
|
-
function SheetDescription({
|
|
116
|
-
className,
|
|
117
|
-
...props
|
|
118
|
-
}: React.ComponentProps<typeof SheetPrimitive.Description>) {
|
|
119
|
-
return (
|
|
120
|
-
<SheetPrimitive.Description
|
|
121
|
-
data-slot="sheet-description"
|
|
122
|
-
className={cn("text-muted-foreground text-sm", className)}
|
|
123
|
-
{...props}
|
|
124
|
-
/>
|
|
125
|
-
)
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
export {
|
|
129
|
-
Sheet,
|
|
130
|
-
SheetTrigger,
|
|
131
|
-
SheetClose,
|
|
132
|
-
SheetContent,
|
|
133
|
-
SheetHeader,
|
|
134
|
-
SheetFooter,
|
|
135
|
-
SheetTitle,
|
|
136
|
-
SheetDescription,
|
|
137
|
-
}
|