beads-kanban-ui 0.1.0 → 0.1.1

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 (154) hide show
  1. package/README.md +16 -222
  2. package/package.json +18 -55
  3. package/.designs/beads-kanban-ui-bj0.md +0 -73
  4. package/.designs/beads-kanban-ui-qxq.md +0 -144
  5. package/.designs/epic-support.md +0 -282
  6. package/.env.local.example +0 -2
  7. package/.eslintrc.json +0 -3
  8. package/.gitattributes +0 -3
  9. package/.github/workflows/release.yml +0 -123
  10. package/.history/README_20260121193710.md +0 -227
  11. package/.history/README_20260121193918.md +0 -227
  12. package/.history/README_20260121193921.md +0 -227
  13. package/.history/README_20260121193933.md +0 -227
  14. package/.history/README_20260121193934.md +0 -227
  15. package/.history/README_20260121193944.md +0 -227
  16. package/.history/README_20260121193953.md +0 -227
  17. package/.history/src/app/page_20260121133429.tsx +0 -134
  18. package/.history/src/app/page_20260121133928.tsx +0 -134
  19. package/.history/src/app/page_20260121144850.tsx +0 -138
  20. package/.history/src/app/page_20260121144854.tsx +0 -138
  21. package/.history/src/app/page_20260121144858.tsx +0 -138
  22. package/.history/src/app/page_20260121144902.tsx +0 -138
  23. package/.history/src/app/page_20260121144906.tsx +0 -138
  24. package/.history/src/app/page_20260121144911.tsx +0 -138
  25. package/.history/src/app/page_20260121144928.tsx +0 -138
  26. package/.playwright-mcp/.playwright-mcp/morphing-dialog-wheel-scroll-fix.png +0 -0
  27. package/.playwright-mcp/beams-test.png +0 -0
  28. package/.playwright-mcp/card-verification.png +0 -0
  29. package/.playwright-mcp/design-doc-dialog-fix-verification.png +0 -0
  30. package/.playwright-mcp/dialog-width-test.png +0 -0
  31. package/.playwright-mcp/homepage.png +0 -0
  32. package/.playwright-mcp/morphing-dialog-expanded.png +0 -0
  33. package/.playwright-mcp/morphing-dialog-fixes-final.png +0 -0
  34. package/.playwright-mcp/morphing-dialog-open.png +0 -0
  35. package/.playwright-mcp/page-2026-01-21T14-08-31-529Z.png +0 -0
  36. package/.playwright-mcp/page-2026-01-21T14-09-23-431Z.png +0 -0
  37. package/.playwright-mcp/page-2026-01-21T14-10-28-773Z.png +0 -0
  38. package/.playwright-mcp/page-2026-01-21T14-10-47-432Z.png +0 -0
  39. package/.playwright-mcp/page-2026-01-21T14-11-12-350Z.png +0 -0
  40. package/.playwright-mcp/screenshot-after-click.png +0 -0
  41. package/.playwright-mcp/screenshot-after-dialog-click.png +0 -0
  42. package/.playwright-mcp/sheet-restored-after-dialog-close.png +0 -0
  43. package/.playwright-mcp/test-1-sheet-open-with-overlay.png +0 -0
  44. package/.playwright-mcp/test-2-morphing-dialog-with-overlay.png +0 -0
  45. package/.playwright-mcp/test-3-sheet-open-dark-overlay.png +0 -0
  46. package/.playwright-mcp/test-4-morphing-dialog-with-dark-overlay.png +0 -0
  47. package/.playwright-mcp/test-5-morphing-dialog-scrolled.png +0 -0
  48. package/.playwright-mcp/test-6-sheet-restored-after-dialog-close.png +0 -0
  49. package/.playwright-mcp/wheel-scroll-fixed.png +0 -0
  50. package/Screenshots/bead-detail.png +0 -0
  51. package/Screenshots/dashboard.png +0 -0
  52. package/Screenshots/kanban-board.png +0 -0
  53. package/components.json +0 -27
  54. package/logo/logo.svg +0 -1
  55. package/next.config.js +0 -9
  56. package/npm/README.md +0 -37
  57. package/npm/package.json +0 -20
  58. package/postcss.config.js +0 -6
  59. package/public/logo.svg +0 -1
  60. package/restart.sh +0 -5
  61. package/server/Cargo.lock +0 -1685
  62. package/server/Cargo.toml +0 -24
  63. package/server/src/db.rs +0 -570
  64. package/server/src/main.rs +0 -141
  65. package/server/src/routes/beads.rs +0 -413
  66. package/server/src/routes/cli.rs +0 -150
  67. package/server/src/routes/fs.rs +0 -360
  68. package/server/src/routes/git.rs +0 -169
  69. package/server/src/routes/mod.rs +0 -107
  70. package/server/src/routes/projects.rs +0 -177
  71. package/server/src/routes/watch.rs +0 -211
  72. package/src/app/globals.css +0 -101
  73. package/src/app/layout.tsx +0 -36
  74. package/src/app/page.tsx +0 -348
  75. package/src/app/project/kanban-board.tsx +0 -356
  76. package/src/app/project/page.tsx +0 -18
  77. package/src/app/settings/page.tsx +0 -224
  78. package/src/components/Beams.css +0 -5
  79. package/src/components/Beams.jsx +0 -307
  80. package/src/components/Galaxy.css +0 -5
  81. package/src/components/Galaxy.jsx +0 -333
  82. package/src/components/activity-timeline.tsx +0 -172
  83. package/src/components/add-project-dialog.tsx +0 -219
  84. package/src/components/bead-card.tsx +0 -196
  85. package/src/components/bead-detail.tsx +0 -306
  86. package/src/components/color-picker.tsx +0 -101
  87. package/src/components/comment-input.tsx +0 -155
  88. package/src/components/comment-list.tsx +0 -147
  89. package/src/components/dependency-badge.tsx +0 -106
  90. package/src/components/design-doc-dialog.tsx +0 -58
  91. package/src/components/design-doc-preview.tsx +0 -97
  92. package/src/components/design-doc-viewer.tsx +0 -199
  93. package/src/components/editable-project-name.tsx +0 -178
  94. package/src/components/epic-card.tsx +0 -263
  95. package/src/components/folder-browser.tsx +0 -273
  96. package/src/components/footer.tsx +0 -27
  97. package/src/components/kanban/default.tsx +0 -184
  98. package/src/components/kanban-column.tsx +0 -167
  99. package/src/components/project-card.tsx +0 -191
  100. package/src/components/quick-filter-bar.tsx +0 -279
  101. package/src/components/scan-directory-dialog.tsx +0 -368
  102. package/src/components/status-donut.tsx +0 -197
  103. package/src/components/subtask-list.tsx +0 -128
  104. package/src/components/tag-picker.tsx +0 -252
  105. package/src/components/ui/.gitkeep +0 -0
  106. package/src/components/ui/alert-dialog.tsx +0 -141
  107. package/src/components/ui/avatar.tsx +0 -67
  108. package/src/components/ui/badge.tsx +0 -230
  109. package/src/components/ui/button.tsx +0 -433
  110. package/src/components/ui/card/index.tsx +0 -24
  111. package/src/components/ui/card/roiui-card.module.css +0 -197
  112. package/src/components/ui/card/roiui-card.tsx +0 -154
  113. package/src/components/ui/card/shadcn-card.tsx +0 -76
  114. package/src/components/ui/chart.tsx +0 -369
  115. package/src/components/ui/dialog.tsx +0 -122
  116. package/src/components/ui/dropdown-menu.tsx +0 -201
  117. package/src/components/ui/input.tsx +0 -22
  118. package/src/components/ui/kanban.tsx +0 -522
  119. package/src/components/ui/morphing-dialog.tsx +0 -457
  120. package/src/components/ui/popover.tsx +0 -33
  121. package/src/components/ui/progress.tsx +0 -28
  122. package/src/components/ui/scroll-area.tsx +0 -48
  123. package/src/components/ui/select.tsx +0 -159
  124. package/src/components/ui/separator.tsx +0 -31
  125. package/src/components/ui/sheet.tsx +0 -142
  126. package/src/components/ui/skeleton.tsx +0 -15
  127. package/src/components/ui/toast.tsx +0 -129
  128. package/src/components/ui/toaster.tsx +0 -35
  129. package/src/components/ui/tooltip.tsx +0 -30
  130. package/src/hooks/.gitkeep +0 -0
  131. package/src/hooks/use-bead-filters.ts +0 -261
  132. package/src/hooks/use-beads.ts +0 -162
  133. package/src/hooks/use-branch-statuses.ts +0 -161
  134. package/src/hooks/use-epics.ts +0 -173
  135. package/src/hooks/use-file-watcher.ts +0 -111
  136. package/src/hooks/use-keyboard-navigation.ts +0 -282
  137. package/src/hooks/use-project.ts +0 -61
  138. package/src/hooks/use-projects.ts +0 -93
  139. package/src/hooks/use-toast.ts +0 -194
  140. package/src/hooks/useClickOutside.tsx +0 -26
  141. package/src/lib/.gitkeep +0 -0
  142. package/src/lib/api.ts +0 -186
  143. package/src/lib/beads-parser.ts +0 -252
  144. package/src/lib/cli.ts +0 -193
  145. package/src/lib/db.ts +0 -145
  146. package/src/lib/design-doc.ts +0 -74
  147. package/src/lib/epic-parser.ts +0 -242
  148. package/src/lib/git.ts +0 -102
  149. package/src/lib/utils.ts +0 -12
  150. package/src/types/index.ts +0 -107
  151. package/tailwind.config.ts +0 -85
  152. package/tsconfig.json +0 -26
  153. /package/{npm/bin → bin}/cli.js +0 -0
  154. /package/{npm/scripts → scripts}/postinstall.js +0 -0
@@ -1,159 +0,0 @@
1
- "use client"
2
-
3
- import * as React from "react"
4
- import * as SelectPrimitive from "@radix-ui/react-select"
5
- import { Check, ChevronDown, ChevronUp } from "lucide-react"
6
-
7
- import { cn } from "@/lib/utils"
8
-
9
- const Select = SelectPrimitive.Root
10
-
11
- const SelectGroup = SelectPrimitive.Group
12
-
13
- const SelectValue = SelectPrimitive.Value
14
-
15
- const SelectTrigger = React.forwardRef<
16
- React.ElementRef<typeof SelectPrimitive.Trigger>,
17
- React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>
18
- >(({ className, children, ...props }, ref) => (
19
- <SelectPrimitive.Trigger
20
- ref={ref}
21
- className={cn(
22
- "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",
23
- className
24
- )}
25
- {...props}
26
- >
27
- {children}
28
- <SelectPrimitive.Icon asChild>
29
- <ChevronDown className="h-4 w-4 opacity-50" />
30
- </SelectPrimitive.Icon>
31
- </SelectPrimitive.Trigger>
32
- ))
33
- SelectTrigger.displayName = SelectPrimitive.Trigger.displayName
34
-
35
- const SelectScrollUpButton = React.forwardRef<
36
- React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
37
- React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>
38
- >(({ className, ...props }, ref) => (
39
- <SelectPrimitive.ScrollUpButton
40
- ref={ref}
41
- className={cn(
42
- "flex cursor-default items-center justify-center py-1",
43
- className
44
- )}
45
- {...props}
46
- >
47
- <ChevronUp className="h-4 w-4" />
48
- </SelectPrimitive.ScrollUpButton>
49
- ))
50
- SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName
51
-
52
- const SelectScrollDownButton = React.forwardRef<
53
- React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
54
- React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>
55
- >(({ className, ...props }, ref) => (
56
- <SelectPrimitive.ScrollDownButton
57
- ref={ref}
58
- className={cn(
59
- "flex cursor-default items-center justify-center py-1",
60
- className
61
- )}
62
- {...props}
63
- >
64
- <ChevronDown className="h-4 w-4" />
65
- </SelectPrimitive.ScrollDownButton>
66
- ))
67
- SelectScrollDownButton.displayName =
68
- SelectPrimitive.ScrollDownButton.displayName
69
-
70
- const SelectContent = React.forwardRef<
71
- React.ElementRef<typeof SelectPrimitive.Content>,
72
- React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>
73
- >(({ className, children, position = "popper", ...props }, ref) => (
74
- <SelectPrimitive.Portal>
75
- <SelectPrimitive.Content
76
- ref={ref}
77
- className={cn(
78
- "relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-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 origin-[--radix-select-content-transform-origin]",
79
- position === "popper" &&
80
- "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
81
- className
82
- )}
83
- position={position}
84
- {...props}
85
- >
86
- <SelectScrollUpButton />
87
- <SelectPrimitive.Viewport
88
- className={cn(
89
- "p-1",
90
- position === "popper" &&
91
- "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
92
- )}
93
- >
94
- {children}
95
- </SelectPrimitive.Viewport>
96
- <SelectScrollDownButton />
97
- </SelectPrimitive.Content>
98
- </SelectPrimitive.Portal>
99
- ))
100
- SelectContent.displayName = SelectPrimitive.Content.displayName
101
-
102
- const SelectLabel = React.forwardRef<
103
- React.ElementRef<typeof SelectPrimitive.Label>,
104
- React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>
105
- >(({ className, ...props }, ref) => (
106
- <SelectPrimitive.Label
107
- ref={ref}
108
- className={cn("px-2 py-1.5 text-sm font-semibold", className)}
109
- {...props}
110
- />
111
- ))
112
- SelectLabel.displayName = SelectPrimitive.Label.displayName
113
-
114
- const SelectItem = React.forwardRef<
115
- React.ElementRef<typeof SelectPrimitive.Item>,
116
- React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>
117
- >(({ className, children, ...props }, ref) => (
118
- <SelectPrimitive.Item
119
- ref={ref}
120
- className={cn(
121
- "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",
122
- className
123
- )}
124
- {...props}
125
- >
126
- <span className="absolute right-2 flex h-3.5 w-3.5 items-center justify-center">
127
- <SelectPrimitive.ItemIndicator>
128
- <Check className="h-4 w-4" />
129
- </SelectPrimitive.ItemIndicator>
130
- </span>
131
- <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
132
- </SelectPrimitive.Item>
133
- ))
134
- SelectItem.displayName = SelectPrimitive.Item.displayName
135
-
136
- const SelectSeparator = React.forwardRef<
137
- React.ElementRef<typeof SelectPrimitive.Separator>,
138
- React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator>
139
- >(({ className, ...props }, ref) => (
140
- <SelectPrimitive.Separator
141
- ref={ref}
142
- className={cn("-mx-1 my-1 h-px bg-muted", className)}
143
- {...props}
144
- />
145
- ))
146
- SelectSeparator.displayName = SelectPrimitive.Separator.displayName
147
-
148
- export {
149
- Select,
150
- SelectGroup,
151
- SelectValue,
152
- SelectTrigger,
153
- SelectContent,
154
- SelectLabel,
155
- SelectItem,
156
- SelectSeparator,
157
- SelectScrollUpButton,
158
- SelectScrollDownButton,
159
- }
@@ -1,31 +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
- const Separator = React.forwardRef<
9
- React.ElementRef<typeof SeparatorPrimitive.Root>,
10
- React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>
11
- >(
12
- (
13
- { className, orientation = "horizontal", decorative = true, ...props },
14
- ref
15
- ) => (
16
- <SeparatorPrimitive.Root
17
- ref={ref}
18
- decorative={decorative}
19
- orientation={orientation}
20
- className={cn(
21
- "shrink-0 bg-border",
22
- orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
23
- className
24
- )}
25
- {...props}
26
- />
27
- )
28
- )
29
- Separator.displayName = SeparatorPrimitive.Root.displayName
30
-
31
- export { Separator }
@@ -1,142 +0,0 @@
1
- "use client"
2
-
3
- import * as React from "react"
4
- import * as SheetPrimitive from "@radix-ui/react-dialog"
5
- import { cva, type VariantProps } from "class-variance-authority"
6
- import { X } from "lucide-react"
7
-
8
- import { cn } from "@/lib/utils"
9
-
10
- const Sheet = SheetPrimitive.Root
11
-
12
- const SheetTrigger = SheetPrimitive.Trigger
13
-
14
- const SheetClose = SheetPrimitive.Close
15
-
16
- const SheetPortal = SheetPrimitive.Portal
17
-
18
- const SheetOverlay = React.forwardRef<
19
- React.ElementRef<typeof SheetPrimitive.Overlay>,
20
- React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>
21
- >(({ className, ...props }, ref) => (
22
- <SheetPrimitive.Overlay
23
- className={cn(
24
- "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
25
- className
26
- )}
27
- {...props}
28
- ref={ref}
29
- />
30
- ))
31
- SheetOverlay.displayName = SheetPrimitive.Overlay.displayName
32
-
33
- const sheetVariants = cva(
34
- "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out",
35
- {
36
- variants: {
37
- side: {
38
- top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
39
- bottom:
40
- "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
41
- left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
42
- right:
43
- "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
44
- },
45
- },
46
- defaultVariants: {
47
- side: "right",
48
- },
49
- }
50
- )
51
-
52
- interface SheetContentProps
53
- extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,
54
- VariantProps<typeof sheetVariants> {
55
- overlayClassName?: string
56
- }
57
-
58
- const SheetContent = React.forwardRef<
59
- React.ElementRef<typeof SheetPrimitive.Content>,
60
- SheetContentProps
61
- >(({ side = "right", className, children, overlayClassName, ...props }, ref) => (
62
- <SheetPortal>
63
- <SheetOverlay className={overlayClassName} />
64
- <SheetPrimitive.Content
65
- ref={ref}
66
- className={cn(sheetVariants({ side }), className)}
67
- {...props}
68
- >
69
- <SheetPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
70
- <X className="h-4 w-4" />
71
- <span className="sr-only">Close</span>
72
- </SheetPrimitive.Close>
73
- {children}
74
- </SheetPrimitive.Content>
75
- </SheetPortal>
76
- ))
77
- SheetContent.displayName = SheetPrimitive.Content.displayName
78
-
79
- const SheetHeader = ({
80
- className,
81
- ...props
82
- }: React.HTMLAttributes<HTMLDivElement>) => (
83
- <div
84
- className={cn(
85
- "flex flex-col space-y-2 text-center sm:text-left",
86
- className
87
- )}
88
- {...props}
89
- />
90
- )
91
- SheetHeader.displayName = "SheetHeader"
92
-
93
- const SheetFooter = ({
94
- className,
95
- ...props
96
- }: React.HTMLAttributes<HTMLDivElement>) => (
97
- <div
98
- className={cn(
99
- "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
100
- className
101
- )}
102
- {...props}
103
- />
104
- )
105
- SheetFooter.displayName = "SheetFooter"
106
-
107
- const SheetTitle = React.forwardRef<
108
- React.ElementRef<typeof SheetPrimitive.Title>,
109
- React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>
110
- >(({ className, ...props }, ref) => (
111
- <SheetPrimitive.Title
112
- ref={ref}
113
- className={cn("text-lg font-semibold text-foreground", className)}
114
- {...props}
115
- />
116
- ))
117
- SheetTitle.displayName = SheetPrimitive.Title.displayName
118
-
119
- const SheetDescription = React.forwardRef<
120
- React.ElementRef<typeof SheetPrimitive.Description>,
121
- React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>
122
- >(({ className, ...props }, ref) => (
123
- <SheetPrimitive.Description
124
- ref={ref}
125
- className={cn("text-sm text-muted-foreground", className)}
126
- {...props}
127
- />
128
- ))
129
- SheetDescription.displayName = SheetPrimitive.Description.displayName
130
-
131
- export {
132
- Sheet,
133
- SheetPortal,
134
- SheetOverlay,
135
- SheetTrigger,
136
- SheetClose,
137
- SheetContent,
138
- SheetHeader,
139
- SheetFooter,
140
- SheetTitle,
141
- SheetDescription,
142
- }
@@ -1,15 +0,0 @@
1
- import { cn } from "@/lib/utils"
2
-
3
- function Skeleton({
4
- className,
5
- ...props
6
- }: React.HTMLAttributes<HTMLDivElement>) {
7
- return (
8
- <div
9
- className={cn("animate-pulse rounded-md bg-primary/10", className)}
10
- {...props}
11
- />
12
- )
13
- }
14
-
15
- export { Skeleton }
@@ -1,129 +0,0 @@
1
- "use client"
2
-
3
- import * as React from "react"
4
- import * as ToastPrimitives from "@radix-ui/react-toast"
5
- import { cva, type VariantProps } from "class-variance-authority"
6
- import { X } from "lucide-react"
7
-
8
- import { cn } from "@/lib/utils"
9
-
10
- const ToastProvider = ToastPrimitives.Provider
11
-
12
- const ToastViewport = React.forwardRef<
13
- React.ElementRef<typeof ToastPrimitives.Viewport>,
14
- React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>
15
- >(({ className, ...props }, ref) => (
16
- <ToastPrimitives.Viewport
17
- ref={ref}
18
- className={cn(
19
- "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
20
- className
21
- )}
22
- {...props}
23
- />
24
- ))
25
- ToastViewport.displayName = ToastPrimitives.Viewport.displayName
26
-
27
- const toastVariants = cva(
28
- "group pointer-events-auto relative flex w-full items-center justify-between space-x-2 overflow-hidden rounded-md border p-4 pr-6 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
29
- {
30
- variants: {
31
- variant: {
32
- default: "border bg-background text-foreground",
33
- destructive:
34
- "destructive group border-destructive bg-destructive text-destructive-foreground",
35
- },
36
- },
37
- defaultVariants: {
38
- variant: "default",
39
- },
40
- }
41
- )
42
-
43
- const Toast = React.forwardRef<
44
- React.ElementRef<typeof ToastPrimitives.Root>,
45
- React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &
46
- VariantProps<typeof toastVariants>
47
- >(({ className, variant, ...props }, ref) => {
48
- return (
49
- <ToastPrimitives.Root
50
- ref={ref}
51
- className={cn(toastVariants({ variant }), className)}
52
- {...props}
53
- />
54
- )
55
- })
56
- Toast.displayName = ToastPrimitives.Root.displayName
57
-
58
- const ToastAction = React.forwardRef<
59
- React.ElementRef<typeof ToastPrimitives.Action>,
60
- React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>
61
- >(({ className, ...props }, ref) => (
62
- <ToastPrimitives.Action
63
- ref={ref}
64
- className={cn(
65
- "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium transition-colors hover:bg-secondary focus:outline-none focus:ring-1 focus:ring-ring disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
66
- className
67
- )}
68
- {...props}
69
- />
70
- ))
71
- ToastAction.displayName = ToastPrimitives.Action.displayName
72
-
73
- const ToastClose = React.forwardRef<
74
- React.ElementRef<typeof ToastPrimitives.Close>,
75
- React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>
76
- >(({ className, ...props }, ref) => (
77
- <ToastPrimitives.Close
78
- ref={ref}
79
- className={cn(
80
- "absolute right-1 top-1 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-1 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
81
- className
82
- )}
83
- toast-close=""
84
- {...props}
85
- >
86
- <X className="h-4 w-4" />
87
- </ToastPrimitives.Close>
88
- ))
89
- ToastClose.displayName = ToastPrimitives.Close.displayName
90
-
91
- const ToastTitle = React.forwardRef<
92
- React.ElementRef<typeof ToastPrimitives.Title>,
93
- React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title>
94
- >(({ className, ...props }, ref) => (
95
- <ToastPrimitives.Title
96
- ref={ref}
97
- className={cn("text-sm font-semibold [&+div]:text-xs", className)}
98
- {...props}
99
- />
100
- ))
101
- ToastTitle.displayName = ToastPrimitives.Title.displayName
102
-
103
- const ToastDescription = React.forwardRef<
104
- React.ElementRef<typeof ToastPrimitives.Description>,
105
- React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description>
106
- >(({ className, ...props }, ref) => (
107
- <ToastPrimitives.Description
108
- ref={ref}
109
- className={cn("text-sm opacity-90", className)}
110
- {...props}
111
- />
112
- ))
113
- ToastDescription.displayName = ToastPrimitives.Description.displayName
114
-
115
- type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>
116
-
117
- type ToastActionElement = React.ReactElement<typeof ToastAction>
118
-
119
- export {
120
- type ToastProps,
121
- type ToastActionElement,
122
- ToastProvider,
123
- ToastViewport,
124
- Toast,
125
- ToastTitle,
126
- ToastDescription,
127
- ToastClose,
128
- ToastAction,
129
- }
@@ -1,35 +0,0 @@
1
- "use client"
2
-
3
- import { useToast } from "@/hooks/use-toast"
4
- import {
5
- Toast,
6
- ToastClose,
7
- ToastDescription,
8
- ToastProvider,
9
- ToastTitle,
10
- ToastViewport,
11
- } from "@/components/ui/toast"
12
-
13
- export function Toaster() {
14
- const { toasts } = useToast()
15
-
16
- return (
17
- <ToastProvider>
18
- {toasts.map(function ({ id, title, description, action, ...props }) {
19
- return (
20
- <Toast key={id} {...props}>
21
- <div className="grid gap-1">
22
- {title && <ToastTitle>{title}</ToastTitle>}
23
- {description && (
24
- <ToastDescription>{description}</ToastDescription>
25
- )}
26
- </div>
27
- {action}
28
- <ToastClose />
29
- </Toast>
30
- )
31
- })}
32
- <ToastViewport />
33
- </ToastProvider>
34
- )
35
- }
@@ -1,30 +0,0 @@
1
- "use client"
2
-
3
- import * as React from "react"
4
- import * as TooltipPrimitive from "@radix-ui/react-tooltip"
5
-
6
- import { cn } from "@/lib/utils"
7
-
8
- const TooltipProvider = TooltipPrimitive.Provider
9
-
10
- const Tooltip = TooltipPrimitive.Root
11
-
12
- const TooltipTrigger = TooltipPrimitive.Trigger
13
-
14
- const TooltipContent = React.forwardRef<
15
- React.ElementRef<typeof TooltipPrimitive.Content>,
16
- React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
17
- >(({ className, sideOffset = 4, ...props }, ref) => (
18
- <TooltipPrimitive.Content
19
- ref={ref}
20
- sideOffset={sideOffset}
21
- className={cn(
22
- "z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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",
23
- className
24
- )}
25
- {...props}
26
- />
27
- ))
28
- TooltipContent.displayName = TooltipPrimitive.Content.displayName
29
-
30
- export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
File without changes