@hanzo/ui 5.3.25 → 5.3.28

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 (326) hide show
  1. package/content/index.ts +26 -0
  2. package/docs/_registry/index.ts +426 -0
  3. package/docs/_registry/layout/docs-min.tsx +197 -0
  4. package/docs/_registry/layout/page-min.tsx +128 -0
  5. package/docs/components/accordion.tsx +118 -0
  6. package/docs/components/banner.tsx +144 -0
  7. package/docs/components/callout.tsx +112 -0
  8. package/docs/components/card.tsx +52 -0
  9. package/docs/components/codeblock.tsx +258 -0
  10. package/docs/components/dialog/search-algolia.tsx +132 -0
  11. package/docs/components/dialog/search-default.tsx +131 -0
  12. package/docs/components/dialog/search-orama.tsx +143 -0
  13. package/docs/components/dialog/search.tsx +529 -0
  14. package/docs/components/dynamic-codeblock.tsx +129 -0
  15. package/docs/components/files.tsx +81 -0
  16. package/docs/components/github-info.tsx +107 -0
  17. package/docs/components/heading.tsx +33 -0
  18. package/docs/components/image-zoom.css +77 -0
  19. package/docs/components/image-zoom.tsx +58 -0
  20. package/docs/components/index.ts +7 -0
  21. package/docs/components/inline-toc.tsx +48 -0
  22. package/docs/components/sidebar/base.tsx +451 -0
  23. package/docs/components/sidebar/link-item.tsx +65 -0
  24. package/docs/components/sidebar/page-tree.tsx +113 -0
  25. package/docs/components/sidebar/tabs/dropdown.tsx +109 -0
  26. package/docs/components/sidebar/tabs/index.tsx +89 -0
  27. package/docs/components/steps.tsx +9 -0
  28. package/docs/components/tabs.tsx +203 -0
  29. package/docs/components/toc/clerk.tsx +173 -0
  30. package/docs/components/toc/default.tsx +57 -0
  31. package/docs/components/toc/index.tsx +136 -0
  32. package/docs/components/type-table.tsx +174 -0
  33. package/docs/components/ui/accordion.tsx +88 -0
  34. package/docs/components/ui/button.tsx +28 -0
  35. package/docs/components/ui/collapsible.tsx +42 -0
  36. package/docs/components/ui/navigation-menu.tsx +83 -0
  37. package/docs/components/ui/popover.tsx +32 -0
  38. package/docs/components/ui/scroll-area.tsx +59 -0
  39. package/docs/components/ui/tabs.tsx +145 -0
  40. package/docs/contexts/i18n.tsx +56 -0
  41. package/docs/contexts/search.tsx +165 -0
  42. package/docs/contexts/tree.tsx +65 -0
  43. package/docs/css/black.css +39 -0
  44. package/docs/css/catppuccin.css +49 -0
  45. package/docs/css/colors/index.css +51 -0
  46. package/docs/css/dusk.css +47 -0
  47. package/docs/css/layouts/docs.css +1 -0
  48. package/docs/css/layouts/home.css +1 -0
  49. package/docs/css/layouts/notebook.css +1 -0
  50. package/docs/css/neutral.css +7 -0
  51. package/docs/css/ocean.css +48 -0
  52. package/docs/css/preset.css +305 -0
  53. package/docs/css/purple.css +39 -0
  54. package/docs/css/shadcn.css +36 -0
  55. package/docs/css/shiki.css +90 -0
  56. package/docs/css/solar.css +75 -0
  57. package/docs/css/style.css +9 -0
  58. package/docs/css/vitepress.css +77 -0
  59. package/docs/i18n.tsx +30 -0
  60. package/docs/icons.tsx +354 -0
  61. package/docs/layouts/docs/client.tsx +129 -0
  62. package/docs/layouts/docs/index.tsx +321 -0
  63. package/docs/layouts/docs/page/client.tsx +376 -0
  64. package/docs/layouts/docs/page/index.tsx +251 -0
  65. package/docs/layouts/docs/sidebar.tsx +265 -0
  66. package/docs/layouts/home/client.tsx +375 -0
  67. package/docs/layouts/home/index.tsx +51 -0
  68. package/docs/layouts/home/navbar.tsx +55 -0
  69. package/docs/layouts/notebook/client.tsx +281 -0
  70. package/docs/layouts/notebook/index.tsx +461 -0
  71. package/docs/layouts/notebook/page/client.tsx +375 -0
  72. package/docs/layouts/notebook/page/index.tsx +251 -0
  73. package/docs/layouts/notebook/sidebar.tsx +248 -0
  74. package/docs/layouts/shared/index.tsx +89 -0
  75. package/docs/layouts/shared/language-toggle.tsx +66 -0
  76. package/docs/layouts/shared/link-item.tsx +119 -0
  77. package/docs/layouts/shared/search-toggle.tsx +78 -0
  78. package/docs/layouts/shared/theme-toggle.tsx +86 -0
  79. package/docs/mdx.server.tsx +37 -0
  80. package/docs/mdx.tsx +97 -0
  81. package/docs/og.tsx +101 -0
  82. package/docs/page.tsx +85 -0
  83. package/docs/provider/base.tsx +173 -0
  84. package/docs/provider/next.tsx +23 -0
  85. package/docs/provider/react-router.tsx +23 -0
  86. package/docs/provider/tanstack.tsx +23 -0
  87. package/docs/provider/waku.tsx +23 -0
  88. package/docs/source.ts +3 -0
  89. package/docs/theme/typography/LICENSE +21 -0
  90. package/docs/theme/typography/index.ts +201 -0
  91. package/docs/theme/typography/styles.ts +449 -0
  92. package/docs/utils/cn.ts +1 -0
  93. package/docs/utils/is-active.ts +23 -0
  94. package/docs/utils/merge-refs.ts +15 -0
  95. package/docs/utils/use-copy-button.ts +39 -0
  96. package/docs/utils/use-footer-items.ts +27 -0
  97. package/docs/utils/use-is-scroll-top.ts +21 -0
  98. package/package.json +8 -2
  99. package/dist/3d/button.js +0 -298
  100. package/dist/3d/button.mjs +0 -273
  101. package/dist/3d/card.js +0 -234
  102. package/dist/3d/card.mjs +0 -207
  103. package/dist/3d/carousel.js +0 -371
  104. package/dist/3d/carousel.mjs +0 -344
  105. package/dist/3d/grid.js +0 -362
  106. package/dist/3d/grid.mjs +0 -337
  107. package/dist/3d/index.js +0 -1518
  108. package/dist/3d/index.mjs +0 -1472
  109. package/dist/3d/marquee.js +0 -352
  110. package/dist/3d/marquee.mjs +0 -327
  111. package/dist/3d/pin.js +0 -46
  112. package/dist/3d/pin.mjs +0 -24
  113. package/dist/accordion.js +0 -80
  114. package/dist/accordion.mjs +0 -55
  115. package/dist/alert-dialog.js +0 -220
  116. package/dist/alert-dialog.mjs +0 -187
  117. package/dist/alert.js +0 -68
  118. package/dist/alert.mjs +0 -64
  119. package/dist/animation/animated-background.js +0 -424
  120. package/dist/animation/animated-background.mjs +0 -418
  121. package/dist/animation/animated-beam.js +0 -119
  122. package/dist/animation/animated-beam.mjs +0 -97
  123. package/dist/animation/animated-cursor.js +0 -275
  124. package/dist/animation/animated-cursor.mjs +0 -270
  125. package/dist/animation/animated-icon.js +0 -357
  126. package/dist/animation/animated-icon.mjs +0 -351
  127. package/dist/animation/animated-list.js +0 -339
  128. package/dist/animation/animated-list.mjs +0 -333
  129. package/dist/animation/animated-number.js +0 -283
  130. package/dist/animation/animated-number.mjs +0 -277
  131. package/dist/animation/animated-testimonials.js +0 -97
  132. package/dist/animation/animated-testimonials.mjs +0 -75
  133. package/dist/animation/animated-tooltip.js +0 -67
  134. package/dist/animation/animated-tooltip.mjs +0 -45
  135. package/dist/animation/apple-cards-carousel.js +0 -308
  136. package/dist/animation/apple-cards-carousel.mjs +0 -285
  137. package/dist/animation/apple-hello-effect.js +0 -60
  138. package/dist/animation/apple-hello-effect.mjs +0 -38
  139. package/dist/animation/index.js +0 -1952
  140. package/dist/animation/index.mjs +0 -1921
  141. package/dist/avatar.js +0 -71
  142. package/dist/avatar.mjs +0 -47
  143. package/dist/badge.js +0 -66
  144. package/dist/badge.mjs +0 -40
  145. package/dist/blocks/index.js +0 -1665
  146. package/dist/blocks/index.mjs +0 -1626
  147. package/dist/breadcrumb.js +0 -107
  148. package/dist/breadcrumb.mjs +0 -99
  149. package/dist/calendar.js +0 -189
  150. package/dist/calendar.mjs +0 -164
  151. package/dist/carousel.js +0 -278
  152. package/dist/carousel.mjs +0 -249
  153. package/dist/checkbox.js +0 -60
  154. package/dist/checkbox.mjs +0 -35
  155. package/dist/code/block.js +0 -226
  156. package/dist/code/block.mjs +0 -203
  157. package/dist/code/compare.js +0 -446
  158. package/dist/code/compare.mjs +0 -423
  159. package/dist/code/diff.js +0 -430
  160. package/dist/code/diff.mjs +0 -407
  161. package/dist/code/editor.js +0 -243
  162. package/dist/code/editor.mjs +0 -218
  163. package/dist/code/explorer.js +0 -291
  164. package/dist/code/explorer.mjs +0 -268
  165. package/dist/code/index.js +0 -2551
  166. package/dist/code/index.mjs +0 -2510
  167. package/dist/code/preview.js +0 -400
  168. package/dist/code/preview.mjs +0 -377
  169. package/dist/code/snippet.js +0 -274
  170. package/dist/code/snippet.mjs +0 -250
  171. package/dist/code/tabs.js +0 -75
  172. package/dist/code/tabs.mjs +0 -53
  173. package/dist/code/terminal.js +0 -437
  174. package/dist/code/terminal.mjs +0 -414
  175. package/dist/collapsible.js +0 -33
  176. package/dist/collapsible.mjs +0 -9
  177. package/dist/command.js +0 -262
  178. package/dist/command.mjs +0 -232
  179. package/dist/context-menu.js +0 -207
  180. package/dist/context-menu.mjs +0 -171
  181. package/dist/device/index.js +0 -3
  182. package/dist/device/index.mjs +0 -2
  183. package/dist/dialog.js +0 -151
  184. package/dist/dialog.mjs +0 -121
  185. package/dist/dock/basic.js +0 -174
  186. package/dist/dock/basic.mjs +0 -151
  187. package/dist/dock/index.js +0 -628
  188. package/dist/dock/index.mjs +0 -601
  189. package/dist/dock/limelight-nav.js +0 -295
  190. package/dist/dock/limelight-nav.mjs +0 -274
  191. package/dist/dock/macos.js +0 -141
  192. package/dist/dock/macos.mjs +0 -118
  193. package/dist/dock/menu.js +0 -70
  194. package/dist/dock/menu.mjs +0 -48
  195. package/dist/dock/message.js +0 -144
  196. package/dist/dock/message.mjs +0 -122
  197. package/dist/drawer.js +0 -115
  198. package/dist/drawer.mjs +0 -103
  199. package/dist/dropdown-menu.js +0 -202
  200. package/dist/dropdown-menu.mjs +0 -166
  201. package/dist/finance/AdvancedChart.js +0 -48
  202. package/dist/finance/AdvancedChart.mjs +0 -46
  203. package/dist/finance/CompanyProfile.js +0 -48
  204. package/dist/finance/CompanyProfile.mjs +0 -46
  205. package/dist/finance/CryptoScreener.js +0 -45
  206. package/dist/finance/CryptoScreener.mjs +0 -43
  207. package/dist/finance/Financials.js +0 -52
  208. package/dist/finance/Financials.mjs +0 -50
  209. package/dist/finance/ForexScreener.js +0 -46
  210. package/dist/finance/ForexScreener.mjs +0 -44
  211. package/dist/finance/MarketOverview.js +0 -104
  212. package/dist/finance/MarketOverview.mjs +0 -102
  213. package/dist/finance/NewsTimeline.js +0 -44
  214. package/dist/finance/NewsTimeline.mjs +0 -42
  215. package/dist/finance/OrderEntry.js +0 -131
  216. package/dist/finance/OrderEntry.mjs +0 -129
  217. package/dist/finance/OrdersHistory.js +0 -64
  218. package/dist/finance/OrdersHistory.mjs +0 -62
  219. package/dist/finance/PositionsList.js +0 -80
  220. package/dist/finance/PositionsList.mjs +0 -78
  221. package/dist/finance/StockScreener.js +0 -46
  222. package/dist/finance/StockScreener.mjs +0 -44
  223. package/dist/finance/SymbolInfo.js +0 -46
  224. package/dist/finance/SymbolInfo.mjs +0 -44
  225. package/dist/finance/TechnicalAnalysis.js +0 -54
  226. package/dist/finance/TechnicalAnalysis.mjs +0 -52
  227. package/dist/finance/TickerTape.js +0 -56
  228. package/dist/finance/TickerTape.mjs +0 -54
  229. package/dist/finance/TradingPanel.js +0 -191
  230. package/dist/finance/TradingPanel.mjs +0 -189
  231. package/dist/finance/index.js +0 -930
  232. package/dist/finance/index.mjs +0 -914
  233. package/dist/form/index.js +0 -155
  234. package/dist/form/index.mjs +0 -125
  235. package/dist/form.js +0 -172
  236. package/dist/form.mjs +0 -142
  237. package/dist/hover-card.js +0 -58
  238. package/dist/hover-card.mjs +0 -34
  239. package/dist/index.js +0 -10179
  240. package/dist/index.mjs +0 -9785
  241. package/dist/input-otp.js +0 -79
  242. package/dist/input-otp.mjs +0 -54
  243. package/dist/lib/utils.js +0 -28
  244. package/dist/lib/utils.mjs +0 -24
  245. package/dist/navigation/index.js +0 -98
  246. package/dist/navigation/index.mjs +0 -79
  247. package/dist/navigation-menu.js +0 -149
  248. package/dist/navigation-menu.mjs +0 -116
  249. package/dist/pattern/grid-pattern.js +0 -333
  250. package/dist/pattern/grid-pattern.mjs +0 -310
  251. package/dist/pattern/index.js +0 -333
  252. package/dist/pattern/index.mjs +0 -310
  253. package/dist/popover.js +0 -63
  254. package/dist/popover.mjs +0 -37
  255. package/dist/primitives/index.js +0 -10179
  256. package/dist/primitives/index.mjs +0 -9785
  257. package/dist/primitives-export.js +0 -10179
  258. package/dist/primitives-export.mjs +0 -9785
  259. package/dist/progress.js +0 -62
  260. package/dist/progress.mjs +0 -37
  261. package/dist/project/gantt.js +0 -65
  262. package/dist/project/gantt.mjs +0 -43
  263. package/dist/project/index.js +0 -636
  264. package/dist/project/index.mjs +0 -611
  265. package/dist/project/kanban.js +0 -597
  266. package/dist/project/kanban.mjs +0 -572
  267. package/dist/project/list.js +0 -35
  268. package/dist/project/list.mjs +0 -12
  269. package/dist/radio-group.js +0 -68
  270. package/dist/radio-group.mjs +0 -45
  271. package/dist/resizable.js +0 -72
  272. package/dist/resizable.mjs +0 -48
  273. package/dist/scroll-area.js +0 -89
  274. package/dist/scroll-area.mjs +0 -66
  275. package/dist/select.js +0 -140
  276. package/dist/select.mjs +0 -111
  277. package/dist/separator.js +0 -59
  278. package/dist/separator.mjs +0 -34
  279. package/dist/sheet.js +0 -148
  280. package/dist/sheet.mjs +0 -117
  281. package/dist/skeleton.js +0 -32
  282. package/dist/skeleton.mjs +0 -27
  283. package/dist/slider.js +0 -99
  284. package/dist/slider.mjs +0 -73
  285. package/dist/sonner.js +0 -34
  286. package/dist/sonner.mjs +0 -29
  287. package/dist/switch.js +0 -62
  288. package/dist/switch.mjs +0 -37
  289. package/dist/table.js +0 -110
  290. package/dist/table.mjs +0 -101
  291. package/dist/tabs.js +0 -82
  292. package/dist/tabs.mjs +0 -57
  293. package/dist/tailwind/index.js +0 -2023
  294. package/dist/tailwind/index.mjs +0 -2011
  295. package/dist/textarea.js +0 -78
  296. package/dist/textarea.mjs +0 -56
  297. package/dist/toggle-group.js +0 -118
  298. package/dist/toggle-group.mjs +0 -93
  299. package/dist/toggle.js +0 -71
  300. package/dist/toggle.mjs +0 -48
  301. package/dist/tooltip.js +0 -67
  302. package/dist/tooltip.mjs +0 -40
  303. package/dist/types/index.js +0 -57
  304. package/dist/types/index.mjs +0 -51
  305. package/dist/ui/announcement.js +0 -129
  306. package/dist/ui/announcement.mjs +0 -107
  307. package/dist/ui/avatar-group.js +0 -88
  308. package/dist/ui/avatar-group.mjs +0 -65
  309. package/dist/ui/banner.js +0 -85
  310. package/dist/ui/banner.mjs +0 -62
  311. package/dist/ui/cursor.js +0 -78
  312. package/dist/ui/cursor.mjs +0 -56
  313. package/dist/ui/index.js +0 -475
  314. package/dist/ui/index.mjs +0 -442
  315. package/dist/ui/marquee.js +0 -74
  316. package/dist/ui/marquee.mjs +0 -52
  317. package/dist/ui/pill.js +0 -85
  318. package/dist/ui/pill.mjs +0 -62
  319. package/dist/ui/spinner.js +0 -28
  320. package/dist/ui/spinner.mjs +0 -26
  321. package/dist/ui/tags.js +0 -101
  322. package/dist/ui/tags.mjs +0 -79
  323. package/dist/ui/ticker.js +0 -73
  324. package/dist/ui/ticker.mjs +0 -51
  325. package/dist/util/index.js +0 -457
  326. package/dist/util/index.mjs +0 -399
@@ -1,611 +0,0 @@
1
- "use client";
2
- import * as React2 from 'react';
3
- import { cn } from '@hanzo/ui/lib/utils';
4
- import { jsx, jsxs } from 'react/jsx-runtime';
5
- import { useSensors, useSensor, PointerSensor, DndContext, closestCorners, DragOverlay } from '@dnd-kit/core';
6
- import { arrayMove, useSortable, SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';
7
- import { CSS } from '@dnd-kit/utilities';
8
- import { cva } from 'class-variance-authority';
9
- import { Search, User, Calendar, MoreHorizontal, Edit3, X, Plus } from 'lucide-react';
10
- import { Badge } from '@hanzo/ui/primitives/badge';
11
- import { Button } from '@hanzo/ui/primitives/button';
12
- import { Card, CardHeader } from '@hanzo/ui/primitives/card';
13
- import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from '@hanzo/ui/primitives/dialog';
14
- import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from '@hanzo/ui/primitives/dropdown-menu';
15
- import { Input } from '@hanzo/ui/primitives/input';
16
- import { Label } from '@hanzo/ui/primitives/label';
17
- import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '@hanzo/ui/primitives/select';
18
- import { Textarea } from '@hanzo/ui/primitives/textarea';
19
-
20
- var __defProp = Object.defineProperty;
21
- var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
22
- var Gantt = React2.forwardRef(
23
- ({ className, tasks = [], ...props }, ref) => {
24
- return /* @__PURE__ */ jsx(
25
- "div",
26
- {
27
- ref,
28
- className: cn(
29
- "rounded-lg border bg-card text-card-foreground shadow-sm",
30
- className
31
- ),
32
- ...props,
33
- children: /* @__PURE__ */ jsx("div", { className: "p-6", children: /* @__PURE__ */ jsx("div", { className: "space-y-4", children: tasks.length === 0 ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "No tasks available. Add tasks to display Gantt chart." }) }) : tasks.map((task) => /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
34
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-sm", children: [
35
- /* @__PURE__ */ jsx("span", { className: "font-medium", children: task.name }),
36
- /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground", children: [
37
- task.progress ?? 0,
38
- "%"
39
- ] })
40
- ] }),
41
- /* @__PURE__ */ jsx("div", { className: "h-8 rounded-md bg-muted", children: /* @__PURE__ */ jsx(
42
- "div",
43
- {
44
- className: "h-full rounded-md bg-primary",
45
- style: { width: `${task.progress ?? 0}%` }
46
- }
47
- ) }),
48
- /* @__PURE__ */ jsxs("div", { className: "flex justify-between text-xs text-muted-foreground", children: [
49
- /* @__PURE__ */ jsx("span", { children: task.start.toLocaleDateString() }),
50
- /* @__PURE__ */ jsx("span", { children: task.end.toLocaleDateString() })
51
- ] })
52
- ] }, task.id)) }) })
53
- }
54
- );
55
- }
56
- );
57
- Gantt.displayName = "Gantt";
58
- var priorityVariants = cva(
59
- "inline-flex items-center rounded-full border px-2 py-0.5 text-xs font-semibold",
60
- {
61
- variants: {
62
- priority: {
63
- low: "border-blue-200 bg-blue-50 text-blue-700 dark:border-blue-800 dark:bg-blue-900/20 dark:text-blue-400",
64
- medium: "border-yellow-200 bg-yellow-50 text-yellow-700 dark:border-yellow-800 dark:bg-yellow-900/20 dark:text-yellow-400",
65
- high: "border-orange-200 bg-orange-50 text-orange-700 dark:border-orange-800 dark:bg-orange-900/20 dark:text-orange-400",
66
- urgent: "border-red-200 bg-red-50 text-red-700 dark:border-red-800 dark:bg-red-900/20 dark:text-red-400"
67
- }
68
- },
69
- defaultVariants: {
70
- priority: "low"
71
- }
72
- }
73
- );
74
- function SortableCard({
75
- card,
76
- onEdit,
77
- onDelete
78
- }) {
79
- const {
80
- attributes,
81
- listeners,
82
- setNodeRef,
83
- transform,
84
- transition,
85
- isDragging
86
- } = useSortable({ id: card.id });
87
- const style = {
88
- transform: CSS.Transform.toString(transform),
89
- transition
90
- };
91
- return /* @__PURE__ */ jsx(
92
- "div",
93
- {
94
- ref: setNodeRef,
95
- style,
96
- ...attributes,
97
- ...listeners,
98
- className: cn(
99
- "cursor-grab active:cursor-grabbing",
100
- isDragging && "opacity-50"
101
- ),
102
- children: /* @__PURE__ */ jsx(KanbanCardComponent, { card, onEdit, onDelete })
103
- }
104
- );
105
- }
106
- __name(SortableCard, "SortableCard");
107
- function KanbanCardComponent({
108
- card,
109
- onEdit,
110
- onDelete
111
- }) {
112
- return /* @__PURE__ */ jsx(Card, { className: "mb-3 group hover:shadow-md transition-shadow", children: /* @__PURE__ */ jsx(CardHeader, { className: "pb-3", children: /* @__PURE__ */ jsx("div", { className: "flex items-start justify-between", children: /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
113
- /* @__PURE__ */ jsx("h4", { className: "font-medium text-sm leading-tight mb-2 break-words", children: card.title }),
114
- card.description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground line-clamp-2 mb-2", children: card.description }),
115
- card.labels && card.labels.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1 mb-2", children: card.labels.map((label) => /* @__PURE__ */ jsx(
116
- Badge,
117
- {
118
- variant: "outline",
119
- className: "text-xs h-5",
120
- style: {
121
- backgroundColor: `${label.color}20`,
122
- borderColor: label.color,
123
- color: label.color
124
- },
125
- children: label.name
126
- },
127
- label.id
128
- )) }),
129
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-xs", children: [
130
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
131
- card.priority && /* @__PURE__ */ jsx(
132
- "span",
133
- {
134
- className: cn(
135
- priorityVariants({ priority: card.priority })
136
- ),
137
- children: card.priority
138
- }
139
- ),
140
- card.assignee && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 text-muted-foreground", children: [
141
- /* @__PURE__ */ jsx(User, { className: "h-3 w-3" }),
142
- /* @__PURE__ */ jsx("span", { children: card.assignee })
143
- ] })
144
- ] }),
145
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
146
- card.dueDate && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 text-muted-foreground", children: [
147
- /* @__PURE__ */ jsx(Calendar, { className: "h-3 w-3" }),
148
- /* @__PURE__ */ jsx("span", { children: new Date(card.dueDate).toLocaleDateString() })
149
- ] }),
150
- /* @__PURE__ */ jsxs(DropdownMenu, { children: [
151
- /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
152
- Button,
153
- {
154
- variant: "ghost",
155
- size: "icon",
156
- className: "h-6 w-6 opacity-0 group-hover:opacity-100 transition-opacity",
157
- children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "h-3 w-3" })
158
- }
159
- ) }),
160
- /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", children: [
161
- /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: () => onEdit(card), children: [
162
- /* @__PURE__ */ jsx(Edit3, { className: "h-4 w-4 mr-2" }),
163
- "Edit"
164
- ] }),
165
- /* @__PURE__ */ jsxs(
166
- DropdownMenuItem,
167
- {
168
- onClick: () => onDelete(card.id),
169
- className: "text-destructive",
170
- children: [
171
- /* @__PURE__ */ jsx(X, { className: "h-4 w-4 mr-2" }),
172
- "Delete"
173
- ]
174
- }
175
- )
176
- ] })
177
- ] })
178
- ] })
179
- ] })
180
- ] }) }) }) });
181
- }
182
- __name(KanbanCardComponent, "KanbanCardComponent");
183
- function KanbanColumnComponent({
184
- column,
185
- onAddCard,
186
- onEditCard,
187
- onDeleteCard
188
- }) {
189
- const { setNodeRef } = useSortable({ id: column.id });
190
- return /* @__PURE__ */ jsxs(
191
- "div",
192
- {
193
- ref: setNodeRef,
194
- className: "bg-muted/50 rounded-lg p-4 min-w-[280px] max-w-[280px] flex flex-col",
195
- children: [
196
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-4", children: [
197
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
198
- /* @__PURE__ */ jsx("h3", { className: "font-semibold text-sm", children: column.title }),
199
- /* @__PURE__ */ jsxs(Badge, { variant: "secondary", className: "text-xs", children: [
200
- column.cards.length,
201
- column.limit && `/${column.limit}`
202
- ] })
203
- ] }),
204
- /* @__PURE__ */ jsx(
205
- Button,
206
- {
207
- variant: "ghost",
208
- size: "icon",
209
- className: "h-8 w-8",
210
- onClick: () => onAddCard(column.id),
211
- children: /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4" })
212
- }
213
- )
214
- ] }),
215
- /* @__PURE__ */ jsx(
216
- SortableContext,
217
- {
218
- items: column.cards.map((card) => card.id),
219
- strategy: verticalListSortingStrategy,
220
- children: /* @__PURE__ */ jsx("div", { className: "flex-1 min-h-[200px]", children: column.cards.map((card) => /* @__PURE__ */ jsx(
221
- SortableCard,
222
- {
223
- card,
224
- onEdit: onEditCard,
225
- onDelete: onDeleteCard
226
- },
227
- card.id
228
- )) })
229
- }
230
- )
231
- ]
232
- }
233
- );
234
- }
235
- __name(KanbanColumnComponent, "KanbanColumnComponent");
236
- function CardFormDialog({
237
- open,
238
- onOpenChange,
239
- card,
240
- onSave,
241
- labels
242
- }) {
243
- const [formData, setFormData] = React2.useState({
244
- title: card?.title || "",
245
- description: card?.description || "",
246
- priority: card?.priority || "low",
247
- assignee: card?.assignee || "",
248
- dueDate: card?.dueDate || "",
249
- labels: card?.labels?.map((l) => l.id) || []
250
- });
251
- const handleSubmit = /* @__PURE__ */ __name((e) => {
252
- e.preventDefault();
253
- if (!formData.title.trim()) return;
254
- onSave({
255
- ...card,
256
- ...formData,
257
- labels: labels.filter((l) => formData.labels.includes(l.id)),
258
- updatedAt: (/* @__PURE__ */ new Date()).toISOString()
259
- });
260
- onOpenChange(false);
261
- }, "handleSubmit");
262
- React2.useEffect(() => {
263
- if (card) {
264
- setFormData({
265
- title: card.title,
266
- description: card.description || "",
267
- priority: card.priority || "low",
268
- assignee: card.assignee || "",
269
- dueDate: card.dueDate || "",
270
- labels: card.labels?.map((l) => l.id) || []
271
- });
272
- } else {
273
- setFormData({
274
- title: "",
275
- description: "",
276
- priority: "low",
277
- assignee: "",
278
- dueDate: "",
279
- labels: []
280
- });
281
- }
282
- }, [card]);
283
- return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-w-md", children: [
284
- /* @__PURE__ */ jsxs(DialogHeader, { children: [
285
- /* @__PURE__ */ jsx(DialogTitle, { children: card ? "Edit Card" : "Create Card" }),
286
- /* @__PURE__ */ jsx(DialogDescription, { children: card ? "Update the card details below." : "Create a new card for your kanban board." })
287
- ] }),
288
- /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [
289
- /* @__PURE__ */ jsxs("div", { children: [
290
- /* @__PURE__ */ jsx(Label, { htmlFor: "title", children: "Title *" }),
291
- /* @__PURE__ */ jsx(
292
- Input,
293
- {
294
- id: "title",
295
- value: formData.title,
296
- onChange: (e) => setFormData((prev) => ({ ...prev, title: e.target.value })),
297
- placeholder: "Enter card title...",
298
- required: true
299
- }
300
- )
301
- ] }),
302
- /* @__PURE__ */ jsxs("div", { children: [
303
- /* @__PURE__ */ jsx(Label, { htmlFor: "description", children: "Description" }),
304
- /* @__PURE__ */ jsx(
305
- Textarea,
306
- {
307
- id: "description",
308
- value: formData.description,
309
- onChange: (e) => setFormData((prev) => ({
310
- ...prev,
311
- description: e.target.value
312
- })),
313
- placeholder: "Enter card description...",
314
- rows: 3
315
- }
316
- )
317
- ] }),
318
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
319
- /* @__PURE__ */ jsxs("div", { children: [
320
- /* @__PURE__ */ jsx(Label, { htmlFor: "priority", children: "Priority" }),
321
- /* @__PURE__ */ jsxs(
322
- Select,
323
- {
324
- value: formData.priority,
325
- onValueChange: (value) => setFormData((prev) => ({ ...prev, priority: value })),
326
- children: [
327
- /* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, {}) }),
328
- /* @__PURE__ */ jsxs(SelectContent, { children: [
329
- /* @__PURE__ */ jsx(SelectItem, { value: "low", children: "Low" }),
330
- /* @__PURE__ */ jsx(SelectItem, { value: "medium", children: "Medium" }),
331
- /* @__PURE__ */ jsx(SelectItem, { value: "high", children: "High" }),
332
- /* @__PURE__ */ jsx(SelectItem, { value: "urgent", children: "Urgent" })
333
- ] })
334
- ]
335
- }
336
- )
337
- ] }),
338
- /* @__PURE__ */ jsxs("div", { children: [
339
- /* @__PURE__ */ jsx(Label, { htmlFor: "assignee", children: "Assignee" }),
340
- /* @__PURE__ */ jsx(
341
- Input,
342
- {
343
- id: "assignee",
344
- value: formData.assignee,
345
- onChange: (e) => setFormData((prev) => ({ ...prev, assignee: e.target.value })),
346
- placeholder: "Assign to..."
347
- }
348
- )
349
- ] })
350
- ] }),
351
- /* @__PURE__ */ jsxs("div", { children: [
352
- /* @__PURE__ */ jsx(Label, { htmlFor: "dueDate", children: "Due Date" }),
353
- /* @__PURE__ */ jsx(
354
- Input,
355
- {
356
- id: "dueDate",
357
- type: "date",
358
- value: formData.dueDate,
359
- onChange: (e) => setFormData((prev) => ({ ...prev, dueDate: e.target.value }))
360
- }
361
- )
362
- ] }),
363
- /* @__PURE__ */ jsxs(DialogFooter, { children: [
364
- /* @__PURE__ */ jsx(
365
- Button,
366
- {
367
- type: "button",
368
- variant: "outline",
369
- onClick: () => onOpenChange(false),
370
- children: "Cancel"
371
- }
372
- ),
373
- /* @__PURE__ */ jsxs(Button, { type: "submit", children: [
374
- card ? "Update" : "Create",
375
- " Card"
376
- ] })
377
- ] })
378
- ] })
379
- ] }) });
380
- }
381
- __name(CardFormDialog, "CardFormDialog");
382
- function KanbanBoard({
383
- board,
384
- onUpdateBoard,
385
- className
386
- }) {
387
- const [activeCard, setActiveCard] = React2.useState(null);
388
- const [searchQuery, setSearchQuery] = React2.useState("");
389
- const [cardFormOpen, setCardFormOpen] = React2.useState(false);
390
- const [editingCard, setEditingCard] = React2.useState(
391
- void 0
392
- );
393
- const [activeColumnId, setActiveColumnId] = React2.useState("");
394
- const sensors = useSensors(
395
- useSensor(PointerSensor, {
396
- activationConstraint: {
397
- distance: 8
398
- }
399
- })
400
- );
401
- const filteredBoard = React2.useMemo(() => {
402
- if (!searchQuery.trim()) return board;
403
- const filtered = {
404
- ...board,
405
- columns: board.columns.map((column) => ({
406
- ...column,
407
- cards: column.cards.filter(
408
- (card) => card.title.toLowerCase().includes(searchQuery.toLowerCase()) || card.description?.toLowerCase().includes(searchQuery.toLowerCase()) || card.labels?.some(
409
- (label) => label.name.toLowerCase().includes(searchQuery.toLowerCase())
410
- )
411
- )
412
- }))
413
- };
414
- return filtered;
415
- }, [board, searchQuery]);
416
- const handleDragStart = /* @__PURE__ */ __name((event) => {
417
- const { active } = event;
418
- const card = board.columns.flatMap((col) => col.cards).find((card2) => card2.id === active.id);
419
- setActiveCard(card || null);
420
- }, "handleDragStart");
421
- const handleDragOver = /* @__PURE__ */ __name((event) => {
422
- const { active, over } = event;
423
- if (!over) return;
424
- const activeId = active.id;
425
- const overId = over.id;
426
- const activeContainer = findContainer(activeId);
427
- const overContainer = findContainer(overId);
428
- if (!activeContainer || !overContainer || activeContainer === overContainer) {
429
- return;
430
- }
431
- const updatedBoard = { ...board };
432
- const activeColumnIndex = updatedBoard.columns.findIndex(
433
- (col) => col.id === activeContainer
434
- );
435
- const overColumnIndex = updatedBoard.columns.findIndex(
436
- (col) => col.id === overContainer
437
- );
438
- const activeColumn = updatedBoard.columns[activeColumnIndex];
439
- const overColumn = updatedBoard.columns[overColumnIndex];
440
- const activeCardIndex = activeColumn.cards.findIndex(
441
- (card) => card.id === activeId
442
- );
443
- const [movedCard] = activeColumn.cards.splice(activeCardIndex, 1);
444
- if (overColumn.limit && overColumn.cards.length >= overColumn.limit) {
445
- return;
446
- }
447
- overColumn.cards.push(movedCard);
448
- onUpdateBoard(updatedBoard);
449
- }, "handleDragOver");
450
- const handleDragEnd = /* @__PURE__ */ __name((event) => {
451
- const { active, over } = event;
452
- setActiveCard(null);
453
- if (!over) return;
454
- const activeId = active.id;
455
- const overId = over.id;
456
- const activeContainer = findContainer(activeId);
457
- const overContainer = findContainer(overId);
458
- if (!activeContainer || !overContainer) return;
459
- const activeColumnIndex = board.columns.findIndex(
460
- (col) => col.id === activeContainer
461
- );
462
- const activeColumn = board.columns[activeColumnIndex];
463
- if (activeContainer === overContainer) {
464
- const oldIndex = activeColumn.cards.findIndex(
465
- (card) => card.id === activeId
466
- );
467
- const newIndex = activeColumn.cards.findIndex(
468
- (card) => card.id === overId
469
- );
470
- if (oldIndex !== newIndex) {
471
- const updatedBoard = { ...board };
472
- updatedBoard.columns[activeColumnIndex].cards = arrayMove(
473
- activeColumn.cards,
474
- oldIndex,
475
- newIndex
476
- );
477
- onUpdateBoard(updatedBoard);
478
- }
479
- }
480
- }, "handleDragEnd");
481
- const findContainer = /* @__PURE__ */ __name((id) => {
482
- if (board.columns.some((col) => col.id === id)) {
483
- return id;
484
- }
485
- return board.columns.find((col) => col.cards.some((card) => card.id === id))?.id;
486
- }, "findContainer");
487
- const handleAddCard = /* @__PURE__ */ __name((columnId) => {
488
- setActiveColumnId(columnId);
489
- setEditingCard(void 0);
490
- setCardFormOpen(true);
491
- }, "handleAddCard");
492
- const handleEditCard = /* @__PURE__ */ __name((card) => {
493
- setEditingCard(card);
494
- setActiveColumnId("");
495
- setCardFormOpen(true);
496
- }, "handleEditCard");
497
- const handleSaveCard = /* @__PURE__ */ __name((cardData) => {
498
- const updatedBoard = { ...board };
499
- if (editingCard) {
500
- const columnIndex = updatedBoard.columns.findIndex(
501
- (col) => col.cards.some((card) => card.id === editingCard.id)
502
- );
503
- if (columnIndex !== -1) {
504
- const cardIndex = updatedBoard.columns[columnIndex].cards.findIndex(
505
- (card) => card.id === editingCard.id
506
- );
507
- if (cardIndex !== -1) {
508
- updatedBoard.columns[columnIndex].cards[cardIndex] = {
509
- ...editingCard,
510
- ...cardData
511
- };
512
- }
513
- }
514
- } else {
515
- const columnIndex = updatedBoard.columns.findIndex(
516
- (col) => col.id === activeColumnId
517
- );
518
- if (columnIndex !== -1) {
519
- const newCard = {
520
- id: `card-${Date.now()}`,
521
- title: cardData.title,
522
- description: cardData.description,
523
- labels: cardData.labels,
524
- priority: cardData.priority,
525
- assignee: cardData.assignee,
526
- dueDate: cardData.dueDate,
527
- createdAt: (/* @__PURE__ */ new Date()).toISOString(),
528
- updatedAt: (/* @__PURE__ */ new Date()).toISOString()
529
- };
530
- updatedBoard.columns[columnIndex].cards.push(newCard);
531
- }
532
- }
533
- onUpdateBoard(updatedBoard);
534
- }, "handleSaveCard");
535
- const handleDeleteCard = /* @__PURE__ */ __name((cardId) => {
536
- const updatedBoard = { ...board };
537
- const columnIndex = updatedBoard.columns.findIndex(
538
- (col) => col.cards.some((card) => card.id === cardId)
539
- );
540
- if (columnIndex !== -1) {
541
- updatedBoard.columns[columnIndex].cards = updatedBoard.columns[columnIndex].cards.filter((card) => card.id !== cardId);
542
- onUpdateBoard(updatedBoard);
543
- }
544
- }, "handleDeleteCard");
545
- return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col h-full", className), children: [
546
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-4 border-b", children: [
547
- /* @__PURE__ */ jsx("h1", { className: "text-2xl font-bold", children: board.title }),
548
- /* @__PURE__ */ jsx("div", { className: "flex items-center gap-3", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
549
- /* @__PURE__ */ jsx(Search, { className: "absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-muted-foreground" }),
550
- /* @__PURE__ */ jsx(
551
- Input,
552
- {
553
- placeholder: "Search cards...",
554
- value: searchQuery,
555
- onChange: (e) => setSearchQuery(e.target.value),
556
- className: "pl-9 w-64"
557
- }
558
- )
559
- ] }) })
560
- ] }),
561
- /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-x-auto", children: /* @__PURE__ */ jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ jsxs(
562
- DndContext,
563
- {
564
- sensors,
565
- collisionDetection: closestCorners,
566
- onDragStart: handleDragStart,
567
- onDragOver: handleDragOver,
568
- onDragEnd: handleDragEnd,
569
- children: [
570
- /* @__PURE__ */ jsx("div", { className: "flex gap-6 h-full pb-4", children: filteredBoard.columns.map((column) => /* @__PURE__ */ jsx(
571
- KanbanColumnComponent,
572
- {
573
- column,
574
- onAddCard: handleAddCard,
575
- onEditCard: handleEditCard,
576
- onDeleteCard: handleDeleteCard
577
- },
578
- column.id
579
- )) }),
580
- /* @__PURE__ */ jsx(DragOverlay, { children: activeCard ? /* @__PURE__ */ jsx(
581
- KanbanCardComponent,
582
- {
583
- card: activeCard,
584
- onEdit: () => {
585
- },
586
- onDelete: () => {
587
- }
588
- }
589
- ) : null })
590
- ]
591
- }
592
- ) }) }),
593
- /* @__PURE__ */ jsx(
594
- CardFormDialog,
595
- {
596
- open: cardFormOpen,
597
- onOpenChange: setCardFormOpen,
598
- card: editingCard,
599
- onSave: handleSaveCard,
600
- labels: board.labels
601
- }
602
- )
603
- ] });
604
- }
605
- __name(KanbanBoard, "KanbanBoard");
606
- var List = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("ul", { ref, className: cn("space-y-2", className), ...props }));
607
- List.displayName = "List";
608
- var ListItem = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("li", { ref, className: cn("", className), ...props }));
609
- ListItem.displayName = "ListItem";
610
-
611
- export { Gantt, KanbanBoard, List, ListItem };