@devalok/shilp-sutra-karm 0.9.0 → 0.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/dist/_chunks/kanban-board.js +1869 -482
  2. package/dist/_chunks/task-detail-panel.js +122 -108
  3. package/dist/_chunks/vendor.js +1 -1
  4. package/dist/board/board-column.d.ts +2 -13
  5. package/dist/board/board-column.d.ts.map +1 -1
  6. package/dist/board/board-constants.d.ts +17 -0
  7. package/dist/board/board-constants.d.ts.map +1 -0
  8. package/dist/board/board-context.d.ts +65 -0
  9. package/dist/board/board-context.d.ts.map +1 -0
  10. package/dist/board/board-toolbar.d.ts +5 -0
  11. package/dist/board/board-toolbar.d.ts.map +1 -0
  12. package/dist/board/board-types.d.ts +48 -0
  13. package/dist/board/board-types.d.ts.map +1 -0
  14. package/dist/board/bulk-action-bar.d.ts +5 -0
  15. package/dist/board/bulk-action-bar.d.ts.map +1 -0
  16. package/dist/board/column-empty.d.ts +14 -0
  17. package/dist/board/column-empty.d.ts.map +1 -0
  18. package/dist/board/column-header.d.ts +10 -0
  19. package/dist/board/column-header.d.ts.map +1 -0
  20. package/dist/board/index.d.ts +13 -3
  21. package/dist/board/index.d.ts.map +1 -1
  22. package/dist/board/index.js +20 -5
  23. package/dist/board/kanban-board.d.ts +4 -13
  24. package/dist/board/kanban-board.d.ts.map +1 -1
  25. package/dist/board/task-card.d.ts +11 -16
  26. package/dist/board/task-card.d.ts.map +1 -1
  27. package/dist/board/task-context-menu.d.ts +10 -0
  28. package/dist/board/task-context-menu.d.ts.map +1 -0
  29. package/dist/board/use-board-filters.d.ts +3 -0
  30. package/dist/board/use-board-filters.d.ts.map +1 -0
  31. package/dist/board/use-board-keyboard.d.ts +14 -0
  32. package/dist/board/use-board-keyboard.d.ts.map +1 -0
  33. package/dist/index.d.ts +1 -1
  34. package/dist/index.d.ts.map +1 -1
  35. package/dist/index.js +129 -119
  36. package/package.json +1 -1
  37. package/dist/_chunks/task-constants.js +0 -22
@@ -1,382 +1,1680 @@
1
1
  "use client";
2
- import { jsx as e, jsxs as c, Fragment as X } from "react/jsx-runtime";
3
- import * as F from "react";
4
- import { useState as O, useRef as J, useEffect as Z, useMemo as le, useCallback as L } from "react";
5
- import { u as se } from "./use-composed-ref.js";
6
- import { createPortal as me } from "react-dom";
7
- import { u as fe, C as ue, c as he, a as pe, S as re, v as xe, b as be, d as U, D as ge, e as ve, h as ye, f as Ne, s as we, K as ke, T as Ie, P as De } from "./vendor.js";
8
- import { cn as j } from "@devalok/shilp-sutra/ui/lib/utils";
9
- import { Button as $ } from "@devalok/shilp-sutra/ui/button";
10
- import { Input as H } from "@devalok/shilp-sutra/ui/input";
11
- import { DropdownMenu as Ce, DropdownMenuTrigger as Se, DropdownMenuContent as Oe, DropdownMenuItem as q, DropdownMenuSeparator as Ee } from "@devalok/shilp-sutra/ui/dropdown-menu";
12
- import { IconGripVertical as Re, IconCalendar as Be, IconEye as ee, IconPlus as Q, IconDots as Ke, IconPencil as Ae, IconEyeOff as Te, IconTrash as ze } from "@tabler/icons-react";
13
- import { Badge as Le } from "@devalok/shilp-sutra/ui";
14
- import { AvatarGroup as $e } from "@devalok/shilp-sutra/composed/avatar-group";
15
- import { P as je, a as Me } from "./task-constants.js";
16
- function _e(s) {
17
- const t = new Date(s), r = /* @__PURE__ */ new Date(), h = t.getTime() - r.getTime(), m = Math.ceil(h / (1e3 * 60 * 60 * 24));
18
- return m < 0 ? { label: "Overdue", className: "text-text-error" } : m === 0 ? { label: "Today", className: "text-text-warning" } : m === 1 ? { label: "Tomorrow", className: "text-text-warning" } : {
2
+ import { jsx as e, jsxs as r, Fragment as se } from "react/jsx-runtime";
3
+ import * as j from "react";
4
+ import { useMemo as ne, useState as A, useEffect as oe, useCallback as E, useContext as Qe, createContext as je, useRef as ae } from "react";
5
+ import { createPortal as Ye } from "react-dom";
6
+ import { u as ke, C as Ce, c as Ne, a as qe, S as Ie, v as Xe, b as Je, d as me, D as Ze, e as et, h as tt, f as st, s as nt, K as at, T as rt, P as it } from "./vendor.js";
7
+ import { cn as I } from "@devalok/shilp-sutra/ui/lib/utils";
8
+ import { Input as re } from "@devalok/shilp-sutra/ui/input";
9
+ import { Button as O } from "@devalok/shilp-sutra/ui/button";
10
+ import { Badge as ot } from "@devalok/shilp-sutra/ui/badge";
11
+ import { DropdownMenu as z, DropdownMenuTrigger as V, DropdownMenuContent as F, DropdownMenuLabel as Q, DropdownMenuSeparator as G, DropdownMenuCheckboxItem as he, DropdownMenuRadioGroup as lt, DropdownMenuRadioItem as ct, DropdownMenuItem as W } from "@devalok/shilp-sutra/ui/dropdown-menu";
12
+ import { SegmentedControl as dt } from "@devalok/shilp-sutra/ui/segmented-control";
13
+ import { IconX as ie, IconSearch as ut, IconFilter as mt, IconUser as q, IconLayoutGrid as ht, IconLayoutList as gt, IconArrowRight as ge, IconAlertTriangle as le, IconEye as X, IconTrash as fe, IconPlus as pe, IconDots as ft, IconPencil as pt, IconGauge as xt, IconEyeOff as De, IconCalendar as xe, IconCheck as yt, IconArrowUp as Te, IconArrowDown as Se, IconGripVertical as wt, IconSubtask as vt, IconLock as bt, IconTag as kt } from "@tabler/icons-react";
14
+ import { AvatarGroup as Ct } from "@devalok/shilp-sutra/composed/avatar-group";
15
+ import { u as Re } from "./use-composed-ref.js";
16
+ import { Checkbox as Ae } from "@devalok/shilp-sutra/ui";
17
+ import { Avatar as Nt, AvatarImage as It, AvatarFallback as Dt } from "@devalok/shilp-sutra/ui/avatar";
18
+ import { ContextMenu as Tt, ContextMenuTrigger as St, ContextMenuContent as Rt, ContextMenuSub as Z, ContextMenuSubTrigger as ee, ContextMenuSubContent as te, ContextMenuItem as H, ContextMenuSeparator as At } from "@devalok/shilp-sutra/ui/context-menu";
19
+ const Mt = 320, ye = [
20
+ "bg-category-cyan",
21
+ "bg-category-amber",
22
+ "bg-category-teal",
23
+ "bg-category-indigo",
24
+ "bg-category-orange",
25
+ "bg-category-emerald",
26
+ "bg-category-slate",
27
+ "bg-accent"
28
+ ], ws = {
29
+ LOW: "IconArrowDown",
30
+ MEDIUM: "IconArrowRight",
31
+ HIGH: "IconArrowUp",
32
+ URGENT: "IconAlertTriangle"
33
+ }, ce = {
34
+ LOW: "text-text-tertiary",
35
+ MEDIUM: "text-warning",
36
+ HIGH: "text-error",
37
+ URGENT: "text-error"
38
+ }, we = {
39
+ search: "",
40
+ assignees: [],
41
+ priorities: [],
42
+ labels: [],
43
+ dueDateRange: null
44
+ };
45
+ function Lt(s, t) {
46
+ if (t.search) {
47
+ const n = t.search.toLowerCase();
48
+ if (!s.title.toLowerCase().includes(n) && !s.taskId.toLowerCase().includes(n))
49
+ return !1;
50
+ }
51
+ if (t.priorities.length > 0 && !t.priorities.includes(s.priority))
52
+ return !1;
53
+ if (t.assignees.length > 0) {
54
+ const n = [
55
+ ...s.owner ? [s.owner.id] : [],
56
+ ...s.assignees.map((a) => a.id)
57
+ ];
58
+ if (!t.assignees.some((a) => n.includes(a))) return !1;
59
+ }
60
+ if (t.labels.length > 0 && !t.labels.some((n) => s.labels.includes(n)))
61
+ return !1;
62
+ if (t.dueDateRange && t.dueDateRange !== "none") {
63
+ if (!s.dueDate) return !1;
64
+ const n = new Date(s.dueDate), a = /* @__PURE__ */ new Date();
65
+ a.setHours(0, 0, 0, 0);
66
+ const o = new Date(a);
67
+ switch (o.setHours(23, 59, 59, 999), t.dueDateRange) {
68
+ case "overdue":
69
+ if (n >= a) return !1;
70
+ break;
71
+ case "today":
72
+ if (n < a || n > o) return !1;
73
+ break;
74
+ case "this-week": {
75
+ const l = new Date(a);
76
+ if (l.setDate(a.getDate() + (7 - a.getDay())), l.setHours(23, 59, 59, 999), n > l) return !1;
77
+ break;
78
+ }
79
+ }
80
+ }
81
+ return !0;
82
+ }
83
+ function Et(s, t) {
84
+ return ne(() => t.search !== "" || t.priorities.length > 0 || t.assignees.length > 0 || t.labels.length > 0 || t.dueDateRange != null && t.dueDateRange !== "none" ? s.map((a) => ({
85
+ ...a,
86
+ tasks: a.tasks.filter((o) => Lt(o, t))
87
+ })) : s, [s, t]);
88
+ }
89
+ const Me = je(null);
90
+ function U() {
91
+ const s = Qe(Me);
92
+ if (!s) throw new Error("useBoardContext must be used within <BoardProvider>");
93
+ return s;
94
+ }
95
+ const L = () => {
96
+ };
97
+ function Ot({
98
+ initialData: s,
99
+ currentUserId: t = null,
100
+ children: n,
101
+ ...a
102
+ }) {
103
+ const [o, l] = A(s.columns);
104
+ oe(() => {
105
+ l(s.columns);
106
+ }, [s]);
107
+ const [b, w] = A("default"), [u, d] = A(we), x = E(($) => {
108
+ d((_) => ({ ..._, ...$ }));
109
+ }, []), T = E(() => d(we), []), y = ne(
110
+ () => u.search !== "" || u.priorities.length > 0 || u.assignees.length > 0 || u.labels.length > 0 || u.dueDateRange != null && u.dueDateRange !== "none",
111
+ [u]
112
+ ), g = Et(o, u), [R, h] = A(/* @__PURE__ */ new Set()), k = E(($) => {
113
+ h((_) => {
114
+ const B = new Set(_);
115
+ return B.has($) ? B.delete($) : B.add($), B;
116
+ });
117
+ }, []), c = E(
118
+ ($, _) => {
119
+ const B = o.flatMap((P) => P.tasks), Y = B.findIndex((P) => P.id === $), K = B.findIndex((P) => P.id === _);
120
+ if (Y === -1 || K === -1) return;
121
+ const [J, de] = Y < K ? [Y, K] : [K, Y], ue = B.slice(J, de + 1).map((P) => P.id);
122
+ h((P) => {
123
+ const v = new Set(P);
124
+ return ue.forEach((He) => v.add(He)), v;
125
+ });
126
+ },
127
+ [o]
128
+ ), p = E(() => {
129
+ const $ = g.flatMap((_) => _.tasks.map((B) => B.id));
130
+ h(new Set($));
131
+ }, [g]), m = E(() => h(/* @__PURE__ */ new Set()), []), [C, i] = A(null), [f, D] = A(!1), [M, N] = A(null), S = ne(
132
+ () => ({
133
+ columns: g,
134
+ rawColumns: o,
135
+ viewMode: b,
136
+ setViewMode: w,
137
+ filters: u,
138
+ setFilters: x,
139
+ clearFilters: T,
140
+ hasActiveFilters: y,
141
+ selectedTaskIds: R,
142
+ toggleTaskSelection: k,
143
+ selectRange: c,
144
+ selectAll: p,
145
+ clearSelection: m,
146
+ focusedTaskId: C,
147
+ setFocusedTaskId: i,
148
+ currentUserId: t,
149
+ highlightMyTasks: f,
150
+ setHighlightMyTasks: D,
151
+ activeTask: M,
152
+ setActiveTask: N,
153
+ onTaskMove: a.onTaskMove ?? L,
154
+ onTaskAdd: a.onTaskAdd ?? L,
155
+ onBulkAction: a.onBulkAction ?? L,
156
+ onColumnReorder: a.onColumnReorder ?? L,
157
+ onColumnRename: a.onColumnRename ?? L,
158
+ onColumnDelete: a.onColumnDelete ?? L,
159
+ onColumnToggleVisibility: a.onColumnToggleVisibility ?? L,
160
+ onColumnWipLimitChange: a.onColumnWipLimitChange ?? L,
161
+ onClickTask: a.onClickTask ?? L,
162
+ onAddColumn: a.onAddColumn ?? L,
163
+ onQuickPriorityChange: a.onQuickPriorityChange ?? L,
164
+ onQuickAssign: a.onQuickAssign ?? L,
165
+ onQuickDueDateChange: a.onQuickDueDateChange ?? L,
166
+ onQuickLabelAdd: a.onQuickLabelAdd ?? L,
167
+ onQuickVisibilityChange: a.onQuickVisibilityChange ?? L,
168
+ onQuickDelete: a.onQuickDelete ?? L
169
+ }),
170
+ [
171
+ g,
172
+ o,
173
+ b,
174
+ u,
175
+ x,
176
+ T,
177
+ y,
178
+ R,
179
+ k,
180
+ c,
181
+ p,
182
+ m,
183
+ C,
184
+ t,
185
+ f,
186
+ M,
187
+ a
188
+ ]
189
+ );
190
+ return /* @__PURE__ */ e(Me.Provider, { value: S, children: n });
191
+ }
192
+ const $t = ["LOW", "MEDIUM", "HIGH", "URGENT"], ve = [
193
+ { value: "overdue", label: "Overdue" },
194
+ { value: "today", label: "Today" },
195
+ { value: "this-week", label: "This week" }
196
+ ];
197
+ function Bt(s) {
198
+ const t = /* @__PURE__ */ new Set(), n = [];
199
+ for (const a of s)
200
+ for (const o of a.tasks) {
201
+ o.owner && !t.has(o.owner.id) && (t.add(o.owner.id), n.push(o.owner));
202
+ for (const l of o.assignees)
203
+ t.has(l.id) || (t.add(l.id), n.push(l));
204
+ }
205
+ return n;
206
+ }
207
+ function Pt(s) {
208
+ const t = /* @__PURE__ */ new Set();
209
+ for (const n of s)
210
+ for (const a of n.tasks)
211
+ for (const o of a.labels) t.add(o);
212
+ return Array.from(t).sort();
213
+ }
214
+ function Le() {
215
+ const {
216
+ rawColumns: s,
217
+ filters: t,
218
+ setFilters: n,
219
+ clearFilters: a,
220
+ hasActiveFilters: o,
221
+ viewMode: l,
222
+ setViewMode: b,
223
+ highlightMyTasks: w,
224
+ setHighlightMyTasks: u
225
+ } = U(), [d, x] = A(t.search), T = ae(null), y = E(
226
+ (i) => {
227
+ const f = i.target.value;
228
+ x(f), T.current && clearTimeout(T.current), T.current = setTimeout(() => {
229
+ n({ search: f });
230
+ }, 200);
231
+ },
232
+ [n]
233
+ );
234
+ oe(() => {
235
+ x(t.search);
236
+ }, [t.search]);
237
+ const g = Bt(s), R = Pt(s), h = (i) => {
238
+ const f = t.priorities;
239
+ n({
240
+ priorities: f.includes(i) ? f.filter((D) => D !== i) : [...f, i]
241
+ });
242
+ }, k = (i) => {
243
+ const f = t.assignees;
244
+ n({
245
+ assignees: f.includes(i) ? f.filter((D) => D !== i) : [...f, i]
246
+ });
247
+ }, c = (i) => {
248
+ const f = t.labels;
249
+ n({
250
+ labels: f.includes(i) ? f.filter((D) => D !== i) : [...f, i]
251
+ });
252
+ }, p = (i) => {
253
+ n({
254
+ dueDateRange: i === t.dueDateRange ? null : i
255
+ });
256
+ }, m = [
257
+ { id: "default", text: "Board", icon: ht },
258
+ { id: "compact", text: "Compact", icon: gt }
259
+ ], C = [];
260
+ for (const i of t.priorities)
261
+ C.push({
262
+ key: `priority-${i}`,
263
+ label: i.charAt(0) + i.slice(1).toLowerCase(),
264
+ onRemove: () => h(i)
265
+ });
266
+ for (const i of t.assignees) {
267
+ const f = g.find((D) => D.id === i);
268
+ C.push({
269
+ key: `assignee-${i}`,
270
+ label: (f == null ? void 0 : f.name) ?? i,
271
+ onRemove: () => k(i)
272
+ });
273
+ }
274
+ for (const i of t.labels)
275
+ C.push({
276
+ key: `label-${i}`,
277
+ label: i,
278
+ onRemove: () => c(i)
279
+ });
280
+ if (t.dueDateRange && t.dueDateRange !== "none") {
281
+ const i = ve.find((f) => f.value === t.dueDateRange);
282
+ C.push({
283
+ key: "due-date",
284
+ label: (i == null ? void 0 : i.label) ?? t.dueDateRange,
285
+ onRemove: () => n({ dueDateRange: null })
286
+ });
287
+ }
288
+ return /* @__PURE__ */ r("div", { className: "flex flex-col gap-ds-02", children: [
289
+ /* @__PURE__ */ r("div", { className: "flex items-center gap-ds-03", children: [
290
+ /* @__PURE__ */ e("div", { className: "relative flex-1 max-w-xs", children: /* @__PURE__ */ e(
291
+ re,
292
+ {
293
+ value: d,
294
+ onChange: y,
295
+ placeholder: "Search tasks...",
296
+ "aria-label": "Search tasks",
297
+ size: "sm",
298
+ startIcon: /* @__PURE__ */ e(ut, { className: "h-ico-sm w-ico-sm" }),
299
+ endIcon: d ? /* @__PURE__ */ e(
300
+ "button",
301
+ {
302
+ onClick: () => {
303
+ x(""), n({ search: "" });
304
+ },
305
+ className: "pointer-events-auto cursor-pointer text-text-tertiary hover:text-text-primary",
306
+ "aria-label": "Clear search",
307
+ children: /* @__PURE__ */ e(ie, { className: "h-3 w-3" })
308
+ }
309
+ ) : void 0
310
+ }
311
+ ) }),
312
+ /* @__PURE__ */ r("div", { className: "flex items-center gap-ds-01", children: [
313
+ /* @__PURE__ */ r(z, { children: [
314
+ /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ r(
315
+ O,
316
+ {
317
+ variant: "ghost",
318
+ size: "sm",
319
+ className: I(
320
+ t.priorities.length > 0 && "text-interactive"
321
+ ),
322
+ title: "Filter by priority",
323
+ children: [
324
+ /* @__PURE__ */ e(mt, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
325
+ "Priority",
326
+ t.priorities.length > 0 && /* @__PURE__ */ r("span", { className: "ml-ds-01 text-ds-xs", children: [
327
+ "(",
328
+ t.priorities.length,
329
+ ")"
330
+ ] })
331
+ ]
332
+ }
333
+ ) }),
334
+ /* @__PURE__ */ r(F, { align: "start", className: "w-44", children: [
335
+ /* @__PURE__ */ e(Q, { children: "Priority" }),
336
+ /* @__PURE__ */ e(G, {}),
337
+ $t.map((i) => /* @__PURE__ */ e(
338
+ he,
339
+ {
340
+ checked: t.priorities.includes(i),
341
+ onCheckedChange: () => h(i),
342
+ children: i.charAt(0) + i.slice(1).toLowerCase()
343
+ },
344
+ i
345
+ ))
346
+ ] })
347
+ ] }),
348
+ g.length > 0 && /* @__PURE__ */ r(z, { children: [
349
+ /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ r(
350
+ O,
351
+ {
352
+ variant: "ghost",
353
+ size: "sm",
354
+ className: I(
355
+ t.assignees.length > 0 && "text-interactive"
356
+ ),
357
+ title: "Filter by assignee",
358
+ children: [
359
+ /* @__PURE__ */ e(q, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
360
+ "Assignee",
361
+ t.assignees.length > 0 && /* @__PURE__ */ r("span", { className: "ml-ds-01 text-ds-xs", children: [
362
+ "(",
363
+ t.assignees.length,
364
+ ")"
365
+ ] })
366
+ ]
367
+ }
368
+ ) }),
369
+ /* @__PURE__ */ r(F, { align: "start", className: "w-48 max-h-56 overflow-y-auto", children: [
370
+ /* @__PURE__ */ e(Q, { children: "Assignee" }),
371
+ /* @__PURE__ */ e(G, {}),
372
+ g.map((i) => /* @__PURE__ */ e(
373
+ he,
374
+ {
375
+ checked: t.assignees.includes(i.id),
376
+ onCheckedChange: () => k(i.id),
377
+ children: i.name
378
+ },
379
+ i.id
380
+ ))
381
+ ] })
382
+ ] }),
383
+ R.length > 0 && /* @__PURE__ */ r(z, { children: [
384
+ /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ r(
385
+ O,
386
+ {
387
+ variant: "ghost",
388
+ size: "sm",
389
+ className: I(
390
+ t.labels.length > 0 && "text-interactive"
391
+ ),
392
+ title: "Filter by label",
393
+ children: [
394
+ "Label",
395
+ t.labels.length > 0 && /* @__PURE__ */ r("span", { className: "ml-ds-01 text-ds-xs", children: [
396
+ "(",
397
+ t.labels.length,
398
+ ")"
399
+ ] })
400
+ ]
401
+ }
402
+ ) }),
403
+ /* @__PURE__ */ r(F, { align: "start", className: "w-44 max-h-56 overflow-y-auto", children: [
404
+ /* @__PURE__ */ e(Q, { children: "Label" }),
405
+ /* @__PURE__ */ e(G, {}),
406
+ R.map((i) => /* @__PURE__ */ e(
407
+ he,
408
+ {
409
+ checked: t.labels.includes(i),
410
+ onCheckedChange: () => c(i),
411
+ children: i
412
+ },
413
+ i
414
+ ))
415
+ ] })
416
+ ] }),
417
+ /* @__PURE__ */ r(z, { children: [
418
+ /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ e(
419
+ O,
420
+ {
421
+ variant: "ghost",
422
+ size: "sm",
423
+ className: I(
424
+ t.dueDateRange && t.dueDateRange !== "none" && "text-interactive"
425
+ ),
426
+ title: "Filter by due date",
427
+ children: "Due date"
428
+ }
429
+ ) }),
430
+ /* @__PURE__ */ r(F, { align: "start", className: "w-40", children: [
431
+ /* @__PURE__ */ e(Q, { children: "Due date" }),
432
+ /* @__PURE__ */ e(G, {}),
433
+ /* @__PURE__ */ e(
434
+ lt,
435
+ {
436
+ value: t.dueDateRange ?? "",
437
+ onValueChange: p,
438
+ children: ve.map((i) => /* @__PURE__ */ e(ct, { value: i.value, children: i.label }, i.value))
439
+ }
440
+ )
441
+ ] })
442
+ ] })
443
+ ] }),
444
+ /* @__PURE__ */ e("div", { className: "flex-1" }),
445
+ /* @__PURE__ */ e(
446
+ O,
447
+ {
448
+ variant: w ? "outline" : "ghost",
449
+ size: "sm",
450
+ onClick: () => u(!w),
451
+ title: "Highlight my tasks",
452
+ "aria-label": "Highlight my tasks",
453
+ "aria-pressed": w,
454
+ className: I(w && "text-interactive"),
455
+ children: /* @__PURE__ */ e(q, { className: "h-ico-sm w-ico-sm" })
456
+ }
457
+ ),
458
+ /* @__PURE__ */ e(
459
+ dt,
460
+ {
461
+ size: "sm",
462
+ variant: "tonal",
463
+ options: m,
464
+ selectedId: l,
465
+ onSelect: (i) => b(i)
466
+ }
467
+ )
468
+ ] }),
469
+ C.length > 0 && /* @__PURE__ */ r("div", { className: "flex items-center gap-ds-02 flex-wrap", children: [
470
+ C.map((i, f) => /* @__PURE__ */ e(
471
+ "div",
472
+ {
473
+ className: "animate-scale-in delay-stagger",
474
+ style: { "--stagger-index": f },
475
+ children: /* @__PURE__ */ e(
476
+ ot,
477
+ {
478
+ variant: "subtle",
479
+ size: "sm",
480
+ onDismiss: i.onRemove,
481
+ children: i.label
482
+ }
483
+ )
484
+ },
485
+ i.key
486
+ )),
487
+ /* @__PURE__ */ e(
488
+ "button",
489
+ {
490
+ onClick: a,
491
+ className: "text-ds-xs text-text-tertiary hover:text-interactive transition-colors",
492
+ "aria-label": "Clear all filters",
493
+ children: "Clear all"
494
+ }
495
+ )
496
+ ] })
497
+ ] });
498
+ }
499
+ Le.displayName = "BoardToolbar";
500
+ const Wt = ["LOW", "MEDIUM", "HIGH", "URGENT"];
501
+ function _t(s) {
502
+ const t = /* @__PURE__ */ new Set(), n = [];
503
+ for (const a of s)
504
+ for (const o of a.tasks) {
505
+ o.owner && !t.has(o.owner.id) && (t.add(o.owner.id), n.push(o.owner));
506
+ for (const l of o.assignees)
507
+ t.has(l.id) || (t.add(l.id), n.push(l));
508
+ }
509
+ return n;
510
+ }
511
+ function Ee() {
512
+ const {
513
+ rawColumns: s,
514
+ columns: t,
515
+ selectedTaskIds: n,
516
+ clearSelection: a,
517
+ onBulkAction: o
518
+ } = U(), l = n.size, b = Array.from(n), w = _t(s), u = (d, x) => {
519
+ o({ type: d, taskIds: b, value: x }), a();
520
+ };
521
+ return /* @__PURE__ */ e(
522
+ "div",
523
+ {
524
+ className: I(
525
+ "grid transition-[grid-template-rows,opacity] duration-moderate-02 ease-expressive-entrance",
526
+ l > 0 ? "grid-rows-[1fr] opacity-100" : "grid-rows-[0fr] opacity-0"
527
+ ),
528
+ "aria-live": "polite",
529
+ children: /* @__PURE__ */ e("div", { className: "overflow-hidden", children: /* @__PURE__ */ r("div", { className: "flex items-center gap-ds-03 py-ds-02", children: [
530
+ /* @__PURE__ */ r("div", { className: "flex items-center gap-ds-02", children: [
531
+ /* @__PURE__ */ r("span", { className: "text-ds-sm font-medium text-text-primary", children: [
532
+ l,
533
+ " selected"
534
+ ] }),
535
+ /* @__PURE__ */ e(
536
+ O,
537
+ {
538
+ variant: "ghost",
539
+ size: "icon-md",
540
+ onClick: a,
541
+ "aria-label": "Clear selection",
542
+ title: "Clear selection",
543
+ className: "h-6 w-6",
544
+ children: /* @__PURE__ */ e(ie, { className: "h-3.5 w-3.5" })
545
+ }
546
+ )
547
+ ] }),
548
+ /* @__PURE__ */ e("div", { className: "h-4 w-px bg-border-subtle" }),
549
+ /* @__PURE__ */ e("div", { className: "animate-fade-in delay-stagger", style: { "--stagger-index": 0 }, children: /* @__PURE__ */ r(z, { children: [
550
+ /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ r(O, { variant: "ghost", size: "sm", title: "Move to column", tabIndex: l > 0 ? 0 : -1, children: [
551
+ /* @__PURE__ */ e(ge, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
552
+ "Move"
553
+ ] }) }),
554
+ /* @__PURE__ */ r(F, { align: "start", className: "w-44", children: [
555
+ /* @__PURE__ */ e(Q, { children: "Move to" }),
556
+ /* @__PURE__ */ e(G, {}),
557
+ t.map((d) => /* @__PURE__ */ e(
558
+ W,
559
+ {
560
+ onClick: () => u("move", d.id),
561
+ children: d.name
562
+ },
563
+ d.id
564
+ ))
565
+ ] })
566
+ ] }) }),
567
+ /* @__PURE__ */ e("div", { className: "animate-fade-in delay-stagger", style: { "--stagger-index": 1 }, children: /* @__PURE__ */ r(z, { children: [
568
+ /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ r(O, { variant: "ghost", size: "sm", title: "Set priority", tabIndex: l > 0 ? 0 : -1, children: [
569
+ /* @__PURE__ */ e(le, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
570
+ "Priority"
571
+ ] }) }),
572
+ /* @__PURE__ */ r(F, { align: "start", className: "w-40", children: [
573
+ /* @__PURE__ */ e(Q, { children: "Set priority" }),
574
+ /* @__PURE__ */ e(G, {}),
575
+ Wt.map((d) => /* @__PURE__ */ e(
576
+ W,
577
+ {
578
+ onClick: () => u("priority", d),
579
+ className: ce[d],
580
+ children: d.charAt(0) + d.slice(1).toLowerCase()
581
+ },
582
+ d
583
+ ))
584
+ ] })
585
+ ] }) }),
586
+ w.length > 0 && /* @__PURE__ */ e("div", { className: "animate-fade-in delay-stagger", style: { "--stagger-index": 2 }, children: /* @__PURE__ */ r(z, { children: [
587
+ /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ r(O, { variant: "ghost", size: "sm", title: "Assign", tabIndex: l > 0 ? 0 : -1, children: [
588
+ /* @__PURE__ */ e(q, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
589
+ "Assign"
590
+ ] }) }),
591
+ /* @__PURE__ */ r(F, { align: "start", className: "w-44 max-h-48 overflow-y-auto", children: [
592
+ /* @__PURE__ */ e(Q, { children: "Assign to" }),
593
+ /* @__PURE__ */ e(G, {}),
594
+ w.map((d) => /* @__PURE__ */ e(
595
+ W,
596
+ {
597
+ onClick: () => u("assign", d.id),
598
+ children: d.name
599
+ },
600
+ d.id
601
+ ))
602
+ ] })
603
+ ] }) }),
604
+ /* @__PURE__ */ e("div", { className: "animate-fade-in delay-stagger", style: { "--stagger-index": 3 }, children: /* @__PURE__ */ r(z, { children: [
605
+ /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ r(O, { variant: "ghost", size: "sm", title: "Set visibility", tabIndex: l > 0 ? 0 : -1, children: [
606
+ /* @__PURE__ */ e(X, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
607
+ "Visibility"
608
+ ] }) }),
609
+ /* @__PURE__ */ r(F, { align: "start", className: "w-40", children: [
610
+ /* @__PURE__ */ e(W, { onClick: () => u("visibility", "INTERNAL"), children: "Internal only" }),
611
+ /* @__PURE__ */ e(W, { onClick: () => u("visibility", "EVERYONE"), children: "Visible to all" })
612
+ ] })
613
+ ] }) }),
614
+ /* @__PURE__ */ e("div", { className: "flex-1" }),
615
+ /* @__PURE__ */ e("div", { className: "animate-fade-in delay-stagger", style: { "--stagger-index": 4 }, children: /* @__PURE__ */ r(
616
+ O,
617
+ {
618
+ variant: "ghost",
619
+ size: "sm",
620
+ className: "text-error hover:text-error",
621
+ onClick: () => u("delete"),
622
+ title: "Delete selected tasks",
623
+ tabIndex: l > 0 ? 0 : -1,
624
+ children: [
625
+ /* @__PURE__ */ e(fe, { className: "h-ico-sm w-ico-sm mr-ds-01" }),
626
+ "Delete"
627
+ ]
628
+ }
629
+ ) })
630
+ ] }) })
631
+ }
632
+ );
633
+ }
634
+ Ee.displayName = "BulkActionBar";
635
+ function zt(s) {
636
+ const t = /* @__PURE__ */ new Set(), n = [];
637
+ for (const a of s.tasks) {
638
+ a.owner && !t.has(a.owner.id) && (t.add(a.owner.id), n.push(a.owner));
639
+ for (const o of a.assignees)
640
+ t.has(o.id) || (t.add(o.id), n.push(o));
641
+ }
642
+ return n;
643
+ }
644
+ function Vt({ columnId: s, currentLimit: t, onClose: n }) {
645
+ const { onColumnWipLimitChange: a } = U(), [o, l] = A(t != null ? String(t) : ""), b = E(() => {
646
+ const u = o.trim();
647
+ if (u === "")
648
+ a(s, null);
649
+ else {
650
+ const d = parseInt(u, 10);
651
+ !isNaN(d) && d > 0 && a(s, d);
652
+ }
653
+ n();
654
+ }, [o, s, a, n]);
655
+ return (
656
+ // eslint-disable-next-line jsx-a11y/no-autofocus -- intentional: input opens after user selects "Set WIP Limit"
657
+ /* @__PURE__ */ e(
658
+ re,
659
+ {
660
+ type: "number",
661
+ min: 1,
662
+ value: o,
663
+ onChange: (u) => l(u.target.value),
664
+ onBlur: b,
665
+ onKeyDown: (u) => {
666
+ u.key === "Enter" && b(), u.key === "Escape" && n();
667
+ },
668
+ placeholder: "Limit...",
669
+ "aria-label": "WIP limit",
670
+ size: "sm",
671
+ className: "w-16 text-center",
672
+ autoFocus: !0
673
+ }
674
+ )
675
+ );
676
+ }
677
+ function Ft(s) {
678
+ const t = /* @__PURE__ */ new Set(), n = [];
679
+ for (const a of s)
680
+ for (const o of a.tasks) {
681
+ o.owner && !t.has(o.owner.id) && (t.add(o.owner.id), n.push(o.owner));
682
+ for (const l of o.assignees)
683
+ t.has(l.id) || (t.add(l.id), n.push(l));
684
+ }
685
+ return n;
686
+ }
687
+ function Oe({ column: s, index: t }) {
688
+ var P;
689
+ const {
690
+ rawColumns: n,
691
+ onColumnRename: a,
692
+ onColumnDelete: o,
693
+ onColumnToggleVisibility: l,
694
+ onTaskAdd: b
695
+ } = U(), [w, u] = A(!1), [d, x] = A(s.name), [T, y] = A(!1), [g, R] = A(!1), [h, k] = A(""), [c, p] = A(null), [m, C] = A(""), i = ae(null), f = Ft(n), D = ye[t % ye.length], M = s.tasks.length, N = s.wipLimit ?? null, S = N != null && M > N, $ = zt(s), _ = () => {
696
+ x(s.name), u(!0);
697
+ }, B = () => {
698
+ const v = d.trim();
699
+ v && v !== s.name && a(s.id, v), u(!1);
700
+ }, Y = (v) => {
701
+ v.key === "Enter" && B(), v.key === "Escape" && (x(s.name), u(!1));
702
+ }, K = () => {
703
+ k(""), p(null), C(""), R(!1);
704
+ }, J = () => {
705
+ const v = h.trim();
706
+ v && (b(s.id, {
707
+ title: v,
708
+ ownerId: c,
709
+ dueDate: m || null
710
+ }), K());
711
+ }, de = (v) => {
712
+ v.key === "Enter" && J(), v.key === "Escape" && K();
713
+ }, ue = () => {
714
+ g ? K() : (R(!0), setTimeout(() => {
715
+ var v;
716
+ return (v = i.current) == null ? void 0 : v.focus();
717
+ }, 50));
718
+ };
719
+ return /* @__PURE__ */ r("div", { className: "group/header flex flex-col gap-ds-02", children: [
720
+ /* @__PURE__ */ r("div", { className: "flex items-center gap-ds-02 px-ds-04 pt-ds-03 pb-ds-02", children: [
721
+ /* @__PURE__ */ e(
722
+ "span",
723
+ {
724
+ className: I("h-2.5 w-2.5 flex-shrink-0 rounded-full", D),
725
+ "aria-hidden": "true",
726
+ title: s.name
727
+ }
728
+ ),
729
+ w ? (
730
+ // eslint-disable-next-line jsx-a11y/no-autofocus -- intentional: input appears after user double-clicks to rename
731
+ /* @__PURE__ */ e(
732
+ re,
733
+ {
734
+ value: d,
735
+ onChange: (v) => x(v.target.value),
736
+ onBlur: B,
737
+ onKeyDown: Y,
738
+ "aria-label": "Column name",
739
+ size: "sm",
740
+ className: "h-ds-xs flex-1 text-ds-sm font-semibold",
741
+ autoFocus: !0
742
+ }
743
+ )
744
+ ) : /* @__PURE__ */ r(
745
+ "h3",
746
+ {
747
+ className: "flex-1 truncate text-ds-sm font-semibold text-text-primary",
748
+ onDoubleClick: _,
749
+ title: s.name,
750
+ "aria-label": N != null ? `${s.name}, ${M} of ${N} tasks${S ? ", WIP limit exceeded" : ""}` : `${s.name}, ${M} tasks`,
751
+ children: [
752
+ s.name,
753
+ /* @__PURE__ */ r("span", { className: "ml-ds-02 text-ds-xs font-normal text-text-tertiary", children: [
754
+ "(",
755
+ M,
756
+ ")"
757
+ ] })
758
+ ]
759
+ }
760
+ ),
761
+ T ? /* @__PURE__ */ e(
762
+ Vt,
763
+ {
764
+ columnId: s.id,
765
+ currentLimit: N,
766
+ onClose: () => y(!1)
767
+ }
768
+ ) : N != null ? /* @__PURE__ */ r(
769
+ "span",
770
+ {
771
+ className: I(
772
+ "flex-shrink-0 text-ds-xs tabular-nums",
773
+ S ? "font-semibold text-error" : "text-text-tertiary"
774
+ ),
775
+ "aria-label": `WIP limit: ${N}${S ? ", exceeded" : ""}`,
776
+ children: [
777
+ "/ ",
778
+ N
779
+ ]
780
+ }
781
+ ) : null,
782
+ /* @__PURE__ */ e(
783
+ O,
784
+ {
785
+ variant: "ghost",
786
+ size: "icon-md",
787
+ className: I(
788
+ "h-ds-xs w-ds-xs flex-shrink-0 opacity-0 transition-opacity",
789
+ "group-hover/header:opacity-100 focus:opacity-100",
790
+ "hover:bg-interactive-subtle hover:text-interactive"
791
+ ),
792
+ "aria-label": "Add task",
793
+ title: "Add task",
794
+ onClick: ue,
795
+ children: /* @__PURE__ */ e(pe, { className: "h-ico-sm w-ico-sm" })
796
+ }
797
+ ),
798
+ /* @__PURE__ */ r(z, { children: [
799
+ /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ e(
800
+ O,
801
+ {
802
+ variant: "ghost",
803
+ size: "icon-md",
804
+ className: I(
805
+ "h-ds-xs w-ds-xs flex-shrink-0 opacity-0 transition-opacity",
806
+ "group-hover/header:opacity-100 focus:opacity-100"
807
+ ),
808
+ "aria-label": "Column options",
809
+ title: "Column options",
810
+ children: /* @__PURE__ */ e(ft, { className: "h-ico-sm w-ico-sm" })
811
+ }
812
+ ) }),
813
+ /* @__PURE__ */ r(F, { align: "end", className: "w-48", children: [
814
+ /* @__PURE__ */ r(W, { onClick: _, children: [
815
+ /* @__PURE__ */ e(pt, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
816
+ "Rename"
817
+ ] }),
818
+ /* @__PURE__ */ r(W, { onClick: () => y(!0), children: [
819
+ /* @__PURE__ */ e(xt, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
820
+ "Set WIP Limit"
821
+ ] }),
822
+ /* @__PURE__ */ e(
823
+ W,
824
+ {
825
+ onClick: () => l(s.id, !(s.isClientVisible ?? !1)),
826
+ children: s.isClientVisible ? /* @__PURE__ */ r(se, { children: [
827
+ /* @__PURE__ */ e(De, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
828
+ "Hide from client"
829
+ ] }) : /* @__PURE__ */ r(se, { children: [
830
+ /* @__PURE__ */ e(X, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
831
+ "Show to client"
832
+ ] })
833
+ }
834
+ ),
835
+ /* @__PURE__ */ e(G, {}),
836
+ /* @__PURE__ */ r(
837
+ W,
838
+ {
839
+ className: "text-error focus:text-error",
840
+ onClick: () => o(s.id),
841
+ children: [
842
+ /* @__PURE__ */ e(fe, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
843
+ "Delete column"
844
+ ]
845
+ }
846
+ )
847
+ ] })
848
+ ] })
849
+ ] }),
850
+ $.length > 0 && /* @__PURE__ */ e("div", { className: "px-ds-04 pb-ds-02", children: /* @__PURE__ */ e(
851
+ Ct,
852
+ {
853
+ users: $,
854
+ max: 3,
855
+ size: "sm",
856
+ showTooltip: !0
857
+ }
858
+ ) }),
859
+ /* @__PURE__ */ e(
860
+ "div",
861
+ {
862
+ className: I(
863
+ "grid transition-[grid-template-rows,opacity] duration-moderate-02 ease-expressive-entrance",
864
+ g ? "grid-rows-[1fr] opacity-100" : "grid-rows-[0fr] opacity-0"
865
+ ),
866
+ children: /* @__PURE__ */ e("div", { className: "overflow-hidden", children: /* @__PURE__ */ r("div", { className: "px-ds-04 pb-ds-03 flex flex-col gap-ds-02", children: [
867
+ /* @__PURE__ */ e(
868
+ re,
869
+ {
870
+ ref: i,
871
+ value: h,
872
+ onChange: (v) => k(v.target.value),
873
+ onKeyDown: de,
874
+ placeholder: "Task title...",
875
+ "aria-label": "New task title",
876
+ size: "sm",
877
+ tabIndex: g ? 0 : -1,
878
+ autoFocus: g
879
+ }
880
+ ),
881
+ /* @__PURE__ */ r("div", { className: "flex items-center gap-ds-01", children: [
882
+ /* @__PURE__ */ r(z, { children: [
883
+ /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ e(
884
+ "button",
885
+ {
886
+ className: I(
887
+ "flex items-center justify-center h-6 w-6 rounded-ds-md transition-colors",
888
+ c ? "text-interactive bg-interactive-subtle" : "text-text-tertiary hover:text-text-primary hover:bg-layer-active"
889
+ ),
890
+ title: c ? `Lead: ${(P = f.find((v) => v.id === c)) == null ? void 0 : P.name}` : "Assign task lead",
891
+ "aria-label": "Assign task lead",
892
+ tabIndex: g ? 0 : -1,
893
+ children: /* @__PURE__ */ e(q, { className: "h-3.5 w-3.5" })
894
+ }
895
+ ) }),
896
+ /* @__PURE__ */ r(F, { align: "start", className: "w-44 max-h-48 overflow-y-auto", children: [
897
+ f.length === 0 && /* @__PURE__ */ e("div", { className: "px-ds-03 py-ds-02 text-ds-xs text-text-tertiary", children: "No members found" }),
898
+ c && /* @__PURE__ */ r(se, { children: [
899
+ /* @__PURE__ */ r(W, { onClick: () => p(null), children: [
900
+ /* @__PURE__ */ e(ie, { className: "mr-ds-02 h-3 w-3 text-text-tertiary" }),
901
+ "Clear lead"
902
+ ] }),
903
+ /* @__PURE__ */ e(G, {})
904
+ ] }),
905
+ f.map((v) => /* @__PURE__ */ e(
906
+ W,
907
+ {
908
+ onClick: () => p(v.id),
909
+ className: I(c === v.id && "bg-interactive-subtle"),
910
+ children: v.name
911
+ },
912
+ v.id
913
+ ))
914
+ ] })
915
+ ] }),
916
+ /* @__PURE__ */ r(
917
+ "label",
918
+ {
919
+ className: I(
920
+ "relative flex items-center justify-center h-6 w-6 rounded-ds-md cursor-pointer transition-colors",
921
+ m ? "text-interactive bg-interactive-subtle" : "text-text-tertiary hover:text-text-primary hover:bg-layer-active"
922
+ ),
923
+ title: m ? `Due: ${m}` : "Set due date",
924
+ "aria-label": "Set due date",
925
+ children: [
926
+ /* @__PURE__ */ e(xe, { className: "h-3.5 w-3.5" }),
927
+ /* @__PURE__ */ e(
928
+ "input",
929
+ {
930
+ type: "date",
931
+ value: m,
932
+ onChange: (v) => C(v.target.value),
933
+ className: "absolute inset-0 opacity-0 cursor-pointer w-full h-full",
934
+ "aria-label": "Due date",
935
+ tabIndex: g ? 0 : -1
936
+ }
937
+ )
938
+ ]
939
+ }
940
+ ),
941
+ /* @__PURE__ */ e("div", { className: "flex-1" }),
942
+ /* @__PURE__ */ e(
943
+ "button",
944
+ {
945
+ onClick: J,
946
+ disabled: !h.trim(),
947
+ className: I(
948
+ "flex items-center justify-center h-6 w-6 rounded-ds-md transition-colors",
949
+ h.trim() ? "text-success hover:bg-success-surface" : "text-text-quaternary cursor-not-allowed"
950
+ ),
951
+ title: "Confirm add task",
952
+ "aria-label": "Confirm add task",
953
+ tabIndex: g ? 0 : -1,
954
+ children: /* @__PURE__ */ e(yt, { className: "h-3.5 w-3.5" })
955
+ }
956
+ ),
957
+ /* @__PURE__ */ e(
958
+ "button",
959
+ {
960
+ onClick: K,
961
+ className: "flex items-center justify-center h-6 w-6 rounded-ds-md text-text-tertiary hover:text-text-primary hover:bg-layer-active transition-colors",
962
+ title: "Cancel",
963
+ "aria-label": "Cancel adding task",
964
+ tabIndex: g ? 0 : -1,
965
+ children: /* @__PURE__ */ e(ie, { className: "h-3.5 w-3.5" })
966
+ }
967
+ )
968
+ ] })
969
+ ] }) })
970
+ }
971
+ )
972
+ ] });
973
+ }
974
+ Oe.displayName = "ColumnHeader";
975
+ function Ut() {
976
+ return /* @__PURE__ */ r(
977
+ "svg",
978
+ {
979
+ width: "48",
980
+ height: "48",
981
+ viewBox: "0 0 48 48",
982
+ fill: "none",
983
+ "aria-hidden": "true",
984
+ xmlns: "http://www.w3.org/2000/svg",
985
+ children: [
986
+ /* @__PURE__ */ e("rect", { x: "10", y: "12", width: "28", height: "32", rx: "3", stroke: "currentColor", strokeWidth: "1.5" }),
987
+ /* @__PURE__ */ e("rect", { x: "18", y: "8", width: "12", height: "8", rx: "2", stroke: "currentColor", strokeWidth: "1.5" }),
988
+ /* @__PURE__ */ e("line", { x1: "16", y1: "24", x2: "32", y2: "24", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
989
+ /* @__PURE__ */ e("line", { x1: "16", y1: "30", x2: "28", y2: "30", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
990
+ /* @__PURE__ */ e("line", { x1: "16", y1: "36", x2: "24", y2: "36", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
991
+ ]
992
+ }
993
+ );
994
+ }
995
+ function Kt() {
996
+ return /* @__PURE__ */ r(
997
+ "svg",
998
+ {
999
+ width: "48",
1000
+ height: "48",
1001
+ viewBox: "0 0 48 48",
1002
+ fill: "none",
1003
+ "aria-hidden": "true",
1004
+ xmlns: "http://www.w3.org/2000/svg",
1005
+ children: [
1006
+ /* @__PURE__ */ e("rect", { x: "14", y: "10", width: "26", height: "16", rx: "3", stroke: "currentColor", strokeWidth: "1.5" }),
1007
+ /* @__PURE__ */ e("rect", { x: "10", y: "19", width: "26", height: "16", rx: "3", stroke: "currentColor", strokeWidth: "1.5" }),
1008
+ /* @__PURE__ */ e("rect", { x: "6", y: "28", width: "26", height: "16", rx: "3", stroke: "currentColor", strokeWidth: "1.5" }),
1009
+ /* @__PURE__ */ e("line", { x1: "12", y1: "35", x2: "26", y2: "35", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
1010
+ ]
1011
+ }
1012
+ );
1013
+ }
1014
+ function Gt() {
1015
+ return /* @__PURE__ */ r(
1016
+ "svg",
1017
+ {
1018
+ width: "48",
1019
+ height: "48",
1020
+ viewBox: "0 0 48 48",
1021
+ fill: "none",
1022
+ "aria-hidden": "true",
1023
+ xmlns: "http://www.w3.org/2000/svg",
1024
+ children: [
1025
+ /* @__PURE__ */ e("circle", { cx: "24", cy: "24", r: "14", stroke: "currentColor", strokeWidth: "1.5" }),
1026
+ /* @__PURE__ */ e(
1027
+ "polyline",
1028
+ {
1029
+ points: "17,24 22,30 31,18",
1030
+ stroke: "currentColor",
1031
+ strokeWidth: "1.5",
1032
+ strokeLinecap: "round",
1033
+ strokeLinejoin: "round"
1034
+ }
1035
+ )
1036
+ ]
1037
+ }
1038
+ );
1039
+ }
1040
+ function Ht() {
1041
+ return /* @__PURE__ */ r(
1042
+ "svg",
1043
+ {
1044
+ width: "48",
1045
+ height: "48",
1046
+ viewBox: "0 0 48 48",
1047
+ fill: "none",
1048
+ "aria-hidden": "true",
1049
+ xmlns: "http://www.w3.org/2000/svg",
1050
+ children: [
1051
+ /* @__PURE__ */ e("rect", { x: "8", y: "26", width: "32", height: "16", rx: "3", stroke: "currentColor", strokeWidth: "1.5" }),
1052
+ /* @__PURE__ */ e(
1053
+ "path",
1054
+ {
1055
+ d: "M8 26 L14 14 H34 L40 26",
1056
+ stroke: "currentColor",
1057
+ strokeWidth: "1.5",
1058
+ strokeLinejoin: "round"
1059
+ }
1060
+ ),
1061
+ /* @__PURE__ */ e("line", { x1: "24", y1: "8", x2: "24", y2: "22", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
1062
+ /* @__PURE__ */ e(
1063
+ "polyline",
1064
+ {
1065
+ points: "19,17 24,22 29,17",
1066
+ stroke: "currentColor",
1067
+ strokeWidth: "1.5",
1068
+ strokeLinecap: "round",
1069
+ strokeLinejoin: "round"
1070
+ }
1071
+ )
1072
+ ]
1073
+ }
1074
+ );
1075
+ }
1076
+ const be = [
1077
+ Ut,
1078
+ Kt,
1079
+ Gt,
1080
+ Ht
1081
+ ];
1082
+ function $e({ index: s, onAddTask: t, isDropTarget: n = !1, className: a }) {
1083
+ const o = be[s % be.length];
1084
+ return /* @__PURE__ */ r(
1085
+ "div",
1086
+ {
1087
+ className: I(
1088
+ "flex flex-col items-center justify-center gap-ds-03 py-ds-07 text-center",
1089
+ a
1090
+ ),
1091
+ children: [
1092
+ /* @__PURE__ */ e("span", { className: "text-text-quaternary", children: /* @__PURE__ */ e(o, {}) }),
1093
+ n ? /* @__PURE__ */ e("p", { className: "text-ds-sm text-text-tertiary", children: "Drop tasks here" }) : /* @__PURE__ */ r(se, { children: [
1094
+ /* @__PURE__ */ e("p", { className: "text-ds-sm text-text-tertiary", children: "No tasks yet" }),
1095
+ /* @__PURE__ */ r(
1096
+ O,
1097
+ {
1098
+ variant: "ghost",
1099
+ size: "sm",
1100
+ onClick: t,
1101
+ children: [
1102
+ /* @__PURE__ */ e(pe, { className: "h-ico-sm w-ico-sm" }),
1103
+ "Add a task"
1104
+ ]
1105
+ }
1106
+ )
1107
+ ] })
1108
+ ]
1109
+ }
1110
+ );
1111
+ }
1112
+ $e.displayName = "ColumnEmpty";
1113
+ function Qt(s) {
1114
+ const t = new Date(s), n = /* @__PURE__ */ new Date(), a = t.getTime() - n.getTime(), o = Math.ceil(a / (1e3 * 60 * 60 * 24));
1115
+ return o < 0 ? { label: "Overdue", className: "text-error" } : o === 0 ? { label: "Today", className: "text-warning" } : o === 1 ? { label: "Tomorrow", className: "text-warning" } : {
19
1116
  label: t.toLocaleDateString("en-IN", { month: "short", day: "numeric" }),
20
1117
  className: "text-text-tertiary"
21
1118
  };
22
1119
  }
23
- const Fe = he(
24
- "group/card relative rounded-ds-lg border border-border/60 bg-layer-01 p-ds-04 shadow-01 transition-[color,background-color,border-color,box-shadow] duration-fast-02 ease-productive-standard hover:shadow-02 hover:border-border cursor-pointer",
1120
+ const Be = {
1121
+ LOW: Se,
1122
+ MEDIUM: ge,
1123
+ HIGH: Te,
1124
+ URGENT: le
1125
+ }, jt = Ne(
1126
+ "group/card relative rounded-ds-lg border border-transparent bg-layer-01 pl-3 pr-ds-03 py-ds-03 transition-all duration-fast-02 ease-productive-standard cursor-pointer",
25
1127
  {
26
1128
  variants: {
27
1129
  state: {
28
- default: "",
1130
+ default: "shadow-01 hover:shadow-02 hover:-translate-y-px hover:border-border",
29
1131
  dragging: "opacity-[0.38]",
30
- overlay: "rotate-[2deg] shadow-03 border-border-interactive/60 ring-1 ring-interactive/40"
1132
+ overlay: "rotate-[2deg] shadow-03 backdrop-blur-sm ring-1 ring-interactive/40"
31
1133
  },
32
1134
  blocked: {
33
1135
  true: "border-l-2 border-l-error",
34
1136
  false: ""
1137
+ },
1138
+ selected: {
1139
+ true: "ring-1 ring-accent/50 shadow-[0_0_6px_rgba(var(--accent-rgb,99,102,241),0.15)] animate-glow-pulse",
1140
+ false: ""
1141
+ },
1142
+ dimmed: {
1143
+ true: "opacity-40",
1144
+ false: ""
35
1145
  }
36
1146
  },
37
1147
  defaultVariants: {
38
1148
  state: "default",
39
- blocked: !1
1149
+ blocked: !1,
1150
+ selected: !1,
1151
+ dimmed: !1
40
1152
  }
41
1153
  }
42
1154
  );
43
- function ae({
1155
+ function Pe(s) {
1156
+ const t = s.trim();
1157
+ if (!t) return "";
1158
+ const n = t.split(/\s+/);
1159
+ return n.length >= 2 ? (n[0][0] + n[1][0]).toUpperCase() : t.slice(0, 2).toUpperCase();
1160
+ }
1161
+ function We({
44
1162
  task: s,
45
1163
  isDragging: t,
46
- isDragOverlay: r,
47
- dragHandleProps: h,
48
- onClickTask: m
1164
+ isDragOverlay: n,
1165
+ dragHandleProps: a
49
1166
  }) {
50
- const w = s.dueDate ? _e(s.dueDate) : null;
51
- return /* @__PURE__ */ c(
1167
+ var p;
1168
+ const {
1169
+ selectedTaskIds: o,
1170
+ toggleTaskSelection: l,
1171
+ focusedTaskId: b,
1172
+ currentUserId: w,
1173
+ highlightMyTasks: u,
1174
+ onClickTask: d
1175
+ } = U(), x = o.has(s.id), T = o.size > 0, y = b === s.id, g = s.dueDate ? Qt(s.dueDate) : null, R = Be[s.priority], h = ce[s.priority], k = u && w != null && ((p = s.owner) == null ? void 0 : p.id) !== w && !s.assignees.some((m) => m.id === w), c = [];
1176
+ s.owner && c.push({ name: s.owner.name, image: s.owner.image, isOwner: !0 });
1177
+ for (const m of s.assignees)
1178
+ s.owner && m.id === s.owner.id || c.push({ name: m.name, image: m.image, isOwner: !1 });
1179
+ return /* @__PURE__ */ r(
52
1180
  "div",
53
1181
  {
54
- role: "button",
1182
+ role: "group",
55
1183
  tabIndex: 0,
56
- className: Fe({
57
- state: r ? "overlay" : t ? "dragging" : "default",
58
- blocked: s.isBlocked
59
- }),
60
- onClick: () => m == null ? void 0 : m(s.id),
61
- onKeyDown: (f) => {
62
- (f.key === "Enter" || f.key === " ") && (f.preventDefault(), m == null || m(s.id));
1184
+ "aria-label": `Task ${s.taskId}: ${s.title}`,
1185
+ className: I(
1186
+ jt({
1187
+ state: n ? "overlay" : t ? "dragging" : "default",
1188
+ blocked: s.isBlocked,
1189
+ selected: x,
1190
+ dimmed: k
1191
+ }),
1192
+ n && "scale-[1.03] rotate-[1.5deg] shadow-03",
1193
+ t && "opacity-40",
1194
+ y && "ring-1 ring-focus"
1195
+ ),
1196
+ onClick: () => d(s.id),
1197
+ onKeyDown: (m) => {
1198
+ (m.key === "Enter" || m.key === " ") && (m.preventDefault(), d(s.id));
63
1199
  },
64
1200
  children: [
65
- /* @__PURE__ */ c("div", { className: "flex items-start gap-ds-02b", children: [
1201
+ /* @__PURE__ */ e(
1202
+ "div",
1203
+ {
1204
+ className: I(
1205
+ "absolute -top-2 -left-2 z-10 transition-opacity",
1206
+ T || x ? "opacity-100 animate-scale-bounce" : "opacity-0 group-hover/card:opacity-100"
1207
+ ),
1208
+ children: /* @__PURE__ */ e(
1209
+ Ae,
1210
+ {
1211
+ checked: x,
1212
+ onCheckedChange: () => l(s.id),
1213
+ onClick: (m) => m.stopPropagation(),
1214
+ "aria-label": `Select task ${s.taskId}`,
1215
+ className: "rounded-full bg-layer-01 shadow-01"
1216
+ }
1217
+ )
1218
+ }
1219
+ ),
1220
+ /* @__PURE__ */ r("div", { className: "flex items-center gap-ds-02", children: [
1221
+ /* @__PURE__ */ e("span", { className: "text-ds-xs font-mono leading-none text-text-tertiary", children: s.taskId }),
1222
+ /* @__PURE__ */ e(R, { className: I("h-3 w-3 flex-shrink-0", h), title: `Priority: ${s.priority}` }),
1223
+ /* @__PURE__ */ e("div", { className: "flex-1" }),
66
1224
  /* @__PURE__ */ e(
67
1225
  "button",
68
1226
  {
69
- className: j(
70
- "mt-ds-01 flex-shrink-0 cursor-grab rounded p-ds-01 opacity-0 transition-opacity",
1227
+ className: I(
1228
+ "flex-shrink-0 cursor-grab rounded p-ds-01 opacity-0 transition-opacity",
71
1229
  "group-hover/card:opacity-[0.38] hover:!opacity-100",
72
1230
  "active:cursor-grabbing",
73
- r && "opacity-[0.38]"
1231
+ n && "opacity-[0.38]"
74
1232
  ),
75
- ...(h == null ? void 0 : h.attributes) ?? {},
76
- ...(h == null ? void 0 : h.listeners) ?? {},
1233
+ ...(a == null ? void 0 : a.attributes) ?? {},
1234
+ ...(a == null ? void 0 : a.listeners) ?? {},
77
1235
  "aria-label": `Drag handle for task: ${s.title}`,
78
1236
  "aria-roledescription": "sortable",
79
- onClick: (f) => f.stopPropagation(),
80
- children: /* @__PURE__ */ e(Re, { className: "h-ico-sm w-ico-sm text-icon-secondary" })
1237
+ onClick: (m) => m.stopPropagation(),
1238
+ children: /* @__PURE__ */ e(wt, { className: "h-ico-sm w-ico-sm text-icon-secondary" })
81
1239
  }
82
- ),
83
- /* @__PURE__ */ e("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ e("p", { className: "text-ds-md font-medium text-text-primary line-clamp-2", children: s.title }) })
1240
+ )
84
1241
  ] }),
85
- /* @__PURE__ */ c("div", { className: "mt-ds-03 flex items-center gap-ds-03", children: [
86
- /* @__PURE__ */ e(
1242
+ /* @__PURE__ */ e("p", { className: "mt-ds-02 text-ds-sm font-medium text-text-primary line-clamp-2", children: s.title }),
1243
+ /* @__PURE__ */ r("div", { className: "mt-ds-03 flex items-center gap-ds-02", children: [
1244
+ g && /* @__PURE__ */ r(
87
1245
  "div",
88
1246
  {
89
- className: j(
90
- "h-2 w-2 rounded-ds-full flex-shrink-0",
91
- Me[s.priority]
1247
+ className: I(
1248
+ "flex items-center gap-ds-01 text-ds-xs leading-tight",
1249
+ g.className
92
1250
  ),
93
- title: je[s.priority]
1251
+ title: `Due: ${g.label}`,
1252
+ children: [
1253
+ /* @__PURE__ */ e(xe, { className: "h-3 w-3" }),
1254
+ /* @__PURE__ */ e("span", { children: g.label })
1255
+ ]
94
1256
  }
95
1257
  ),
96
- s.labels.length > 0 && /* @__PURE__ */ c("div", { className: "flex items-center gap-ds-02 overflow-hidden", children: [
97
- s.labels.slice(0, 2).map((f) => /* @__PURE__ */ e(Le, { size: "sm", className: "max-w-[80px] truncate", children: f }, f)),
98
- s.labels.length > 2 && /* @__PURE__ */ c("span", { className: "text-ds-xs text-text-tertiary", children: [
99
- "+",
100
- s.labels.length - 2
101
- ] })
102
- ] }),
103
- /* @__PURE__ */ e("div", { className: "flex-1" }),
104
- w && /* @__PURE__ */ c(
1258
+ s.subtaskCount > 0 && /* @__PURE__ */ r(
105
1259
  "div",
106
1260
  {
107
- className: j(
108
- "flex items-center gap-ds-01 text-ds-xs leading-tight",
109
- w.className
110
- ),
1261
+ className: "flex items-center gap-ds-01 text-ds-xs text-text-tertiary",
1262
+ title: `Subtasks: ${s.subtasksDone} of ${s.subtaskCount} done`,
111
1263
  children: [
112
- /* @__PURE__ */ e(Be, { className: "h-2.5 w-2.5" }),
113
- /* @__PURE__ */ e("span", { children: w.label })
1264
+ /* @__PURE__ */ e(vt, { className: "h-3 w-3" }),
1265
+ /* @__PURE__ */ r("span", { children: [
1266
+ s.subtasksDone,
1267
+ "/",
1268
+ s.subtaskCount
1269
+ ] })
114
1270
  ]
115
1271
  }
116
1272
  ),
117
- s.assignees.length > 0 && /* @__PURE__ */ e(
118
- $e,
119
- {
120
- users: s.assignees,
121
- size: "sm",
122
- max: 2,
123
- showTooltip: !1
124
- }
125
- )
1273
+ s.visibility === "EVERYONE" && /* @__PURE__ */ e("span", { className: "flex items-center text-text-tertiary", "aria-label": "Client visible", title: "Visible to client", children: /* @__PURE__ */ e(X, { className: "h-3 w-3" }) }),
1274
+ s.isBlocked && /* @__PURE__ */ e("span", { className: "flex items-center text-error", "aria-label": "Blocked", title: "Blocked", children: /* @__PURE__ */ e(bt, { className: "h-3 w-3" }) }),
1275
+ /* @__PURE__ */ e("div", { className: "flex-1" }),
1276
+ c.length > 0 && /* @__PURE__ */ r("div", { className: "flex items-center flex-shrink-0", children: [
1277
+ c.slice(0, 3).map((m, C) => /* @__PURE__ */ r(
1278
+ Nt,
1279
+ {
1280
+ size: "xs",
1281
+ className: I(
1282
+ "text-ds-xs border-2 border-layer-01",
1283
+ C > 0 && "-ml-ds-02b",
1284
+ m.isOwner && "shadow-[0_0_0_1.5px_rgba(var(--accent-rgb,99,102,241),0.35),0_0_6px_rgba(var(--accent-rgb,99,102,241),0.2)]"
1285
+ ),
1286
+ style: { zIndex: c.length - C },
1287
+ title: m.name,
1288
+ children: [
1289
+ m.image && /* @__PURE__ */ e(It, { src: m.image, alt: m.name }),
1290
+ /* @__PURE__ */ e(Dt, { className: "font-body font-semibold", children: Pe(m.name) })
1291
+ ]
1292
+ },
1293
+ C
1294
+ )),
1295
+ c.length > 3 && /* @__PURE__ */ r("span", { className: "ml-ds-01 text-ds-xs text-text-tertiary", children: [
1296
+ "+",
1297
+ c.length - 3
1298
+ ] })
1299
+ ] })
126
1300
  ] })
127
1301
  ]
128
1302
  }
129
1303
  );
130
1304
  }
131
- const ie = F.forwardRef(
132
- function({ task: t, onClickTask: r }, h) {
1305
+ const _e = j.forwardRef(
1306
+ function({ task: t }, n) {
133
1307
  const {
134
- attributes: m,
135
- listeners: w,
136
- setNodeRef: f,
137
- transform: D,
138
- transition: C,
139
- isDragging: T
140
- } = fe({
1308
+ attributes: a,
1309
+ listeners: o,
1310
+ setNodeRef: l,
1311
+ transform: b,
1312
+ transition: w,
1313
+ isDragging: u
1314
+ } = ke({
141
1315
  id: t.id,
142
1316
  data: {
143
1317
  type: "task",
144
1318
  task: t
145
1319
  }
146
- }), E = se(f, h), x = {
147
- transform: ue.Transform.toString(D),
148
- transition: C
1320
+ }), d = Re(l, n), x = {
1321
+ transform: Ce.Transform.toString(b),
1322
+ transition: w
149
1323
  };
150
- return /* @__PURE__ */ e("div", { ref: E, style: x, children: /* @__PURE__ */ e(
151
- ae,
1324
+ return /* @__PURE__ */ e("div", { ref: d, style: x, children: /* @__PURE__ */ e(
1325
+ We,
152
1326
  {
153
1327
  task: t,
154
- isDragging: T,
155
- dragHandleProps: { attributes: m, listeners: w },
156
- onClickTask: r
1328
+ isDragging: u,
1329
+ dragHandleProps: { attributes: a, listeners: o }
157
1330
  }
158
1331
  ) });
159
1332
  }
160
1333
  );
161
- ie.displayName = "TaskCard";
162
- const ne = F.forwardRef(
163
- function({ task: t }, r) {
164
- return /* @__PURE__ */ e("div", { ref: r, children: /* @__PURE__ */ e(ae, { task: t, isDragOverlay: !0 }) });
1334
+ _e.displayName = "TaskCard";
1335
+ const Yt = Ne(
1336
+ "group/card flex items-center gap-ds-02 py-2 pl-3 pr-ds-03 border border-transparent rounded-ds-lg bg-layer-01 transition-all duration-fast-02 ease-productive-standard cursor-pointer hover:bg-layer-active hover:shadow-02 hover:-translate-y-px",
1337
+ {
1338
+ variants: {
1339
+ selected: {
1340
+ true: "ring-1 ring-accent/50 shadow-[0_0_6px_rgba(var(--accent-rgb,99,102,241),0.15)] animate-glow-pulse",
1341
+ false: ""
1342
+ },
1343
+ dimmed: {
1344
+ true: "opacity-40",
1345
+ false: ""
1346
+ }
1347
+ },
1348
+ defaultVariants: {
1349
+ selected: !1,
1350
+ dimmed: !1
1351
+ }
165
1352
  }
166
1353
  );
167
- ne.displayName = "TaskCardOverlay";
168
- const te = [
169
- "border-l-category-cyan",
170
- "border-l-category-amber",
171
- "border-l-category-teal",
172
- "border-l-category-indigo",
173
- "border-l-category-orange",
174
- "border-l-category-emerald",
175
- "border-l-category-slate",
176
- "border-l-accent"
177
- ], oe = F.forwardRef(
178
- function({
179
- column: t,
180
- index: r,
181
- isOverlay: h,
182
- onAddTask: m,
183
- onClickTask: w,
184
- onRenameColumn: f,
185
- onDeleteColumn: D,
186
- onToggleVisibility: C
187
- }, T) {
188
- const [E, x] = O(!1), [k, S] = O(""), [G, R] = O(!1), [B, K] = O(t.name), z = J(null), P = J(null), { setNodeRef: g, isOver: V } = pe({
189
- id: `column-${t.id}`,
190
- data: {
191
- type: "column",
192
- column: t
193
- }
194
- }), I = t.tasks.map((o) => o.id), A = te[r % te.length], M = () => {
195
- k.trim() && (m(t.id, k.trim()), S(""), x(!1));
196
- }, W = (o) => {
197
- o.key === "Enter" && M(), o.key === "Escape" && (S(""), x(!1));
198
- }, _ = () => {
199
- B.trim() && B.trim() !== t.name && (f == null || f(t.id, B.trim())), R(!1);
200
- }, Y = (o) => {
201
- o.key === "Enter" && _(), o.key === "Escape" && (K(t.name), R(!1));
202
- };
203
- return /* @__PURE__ */ c(
204
- "div",
205
- {
206
- ref: T,
207
- className: j(
208
- /* intentional: board column fixed width — matches add-column button */
209
- "flex h-full w-[300px] flex-shrink-0 flex-col rounded-ds-xl border-l-[3px] bg-layer-01 shadow-01",
210
- A,
211
- h && "shadow-04"
212
- ),
213
- children: [
214
- /* @__PURE__ */ c("div", { className: "flex items-center gap-ds-03 px-ds-04 py-ds-04", children: [
215
- G ? /* @__PURE__ */ e(
216
- H,
217
- {
218
- ref: P,
219
- value: B,
220
- onChange: (o) => K(o.target.value),
221
- onBlur: _,
222
- onKeyDown: Y,
223
- className: "h-ds-xs-plus text-ds-md font-semibold",
224
- autoFocus: !0
225
- }
226
- ) : /* @__PURE__ */ e(
227
- "h3",
228
- {
229
- className: "text-ds-md font-semibold text-text-primary truncate",
230
- onDoubleClick: () => {
231
- K(t.name), R(!0);
232
- },
233
- children: t.name
234
- }
235
- ),
236
- /* @__PURE__ */ e("span", { className: "flex h-5 min-w-[20px] items-center justify-center rounded-ds-full bg-field px-ds-02b text-ds-sm font-medium text-text-tertiary", children: t.tasks.length }),
237
- t.isClientVisible && /* @__PURE__ */ e(
238
- ee,
239
- {
240
- className: "h-3 w-3 text-text-tertiary",
241
- "aria-label": "Visible to client"
242
- }
1354
+ function ze({
1355
+ task: s,
1356
+ isDragging: t,
1357
+ isDragOverlay: n
1358
+ }) {
1359
+ var k;
1360
+ const {
1361
+ selectedTaskIds: a,
1362
+ toggleTaskSelection: o,
1363
+ focusedTaskId: l,
1364
+ currentUserId: b,
1365
+ highlightMyTasks: w,
1366
+ onClickTask: u
1367
+ } = U(), d = a.has(s.id), x = a.size > 0, T = l === s.id, y = Be[s.priority], g = ce[s.priority], R = w && b != null && ((k = s.owner) == null ? void 0 : k.id) !== b && !s.assignees.some((c) => c.id === b), h = s.owner ?? s.assignees[0] ?? null;
1368
+ return /* @__PURE__ */ r(
1369
+ "div",
1370
+ {
1371
+ role: "group",
1372
+ tabIndex: 0,
1373
+ "aria-label": `Task ${s.taskId}: ${s.title}`,
1374
+ className: I(
1375
+ "relative",
1376
+ Yt({
1377
+ selected: d,
1378
+ dimmed: R
1379
+ }),
1380
+ t && "opacity-40",
1381
+ n && "scale-[1.03] rotate-[1.5deg] shadow-03",
1382
+ T && "ring-1 ring-focus"
1383
+ ),
1384
+ onClick: () => u(s.id),
1385
+ onKeyDown: (c) => {
1386
+ (c.key === "Enter" || c.key === " ") && (c.preventDefault(), u(s.id));
1387
+ },
1388
+ children: [
1389
+ /* @__PURE__ */ e(
1390
+ "div",
1391
+ {
1392
+ className: I(
1393
+ "absolute -top-1.5 -left-1.5 z-10 transition-opacity",
1394
+ x || d ? "opacity-100 animate-scale-bounce" : "opacity-0 group-hover/card:opacity-100"
243
1395
  ),
244
- /* @__PURE__ */ e("div", { className: "flex-1" }),
245
- /* @__PURE__ */ e(
246
- $,
1396
+ children: /* @__PURE__ */ e(
1397
+ Ae,
247
1398
  {
248
- variant: "ghost",
249
- size: "icon-md",
250
- className: "h-ds-xs w-ds-xs opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 focus:opacity-100 hover:bg-interactive-subtle hover:text-interactive transition-opacity",
251
- "aria-label": "Add task",
252
- onClick: () => {
253
- x(!0), setTimeout(() => {
254
- var o;
255
- return (o = z.current) == null ? void 0 : o.focus();
256
- }, 50);
257
- },
258
- children: /* @__PURE__ */ e(Q, { className: "h-ico-sm w-ico-sm" })
1399
+ checked: d,
1400
+ onCheckedChange: () => o(s.id),
1401
+ onClick: (c) => c.stopPropagation(),
1402
+ "aria-label": `Select task ${s.taskId}`,
1403
+ className: "rounded-full bg-layer-01 shadow-01"
259
1404
  }
1405
+ )
1406
+ }
1407
+ ),
1408
+ /* @__PURE__ */ e(y, { className: I("h-3.5 w-3.5 flex-shrink-0", g), title: `Priority: ${s.priority}` }),
1409
+ /* @__PURE__ */ e("span", { className: "text-ds-xs font-mono text-text-tertiary flex-shrink-0", children: s.taskId }),
1410
+ /* @__PURE__ */ e("span", { className: "text-ds-sm text-text-primary line-clamp-1 flex-1 min-w-0", children: s.title }),
1411
+ s.subtaskCount > 0 && /* @__PURE__ */ r("span", { className: "text-ds-xs text-text-tertiary flex-shrink-0", children: [
1412
+ s.subtasksDone,
1413
+ "/",
1414
+ s.subtaskCount
1415
+ ] }),
1416
+ h && /* @__PURE__ */ e(
1417
+ "div",
1418
+ {
1419
+ className: I(
1420
+ "flex h-[14px] w-[14px] shrink-0 items-center justify-center rounded-full border border-layer-01 bg-interactive-subtle text-[6px] font-semibold leading-none text-interactive overflow-hidden",
1421
+ s.owner && "shadow-[0_0_0_1px_rgba(var(--accent-rgb,99,102,241),0.35),0_0_4px_rgba(var(--accent-rgb,99,102,241),0.2)]"
260
1422
  ),
261
- /* @__PURE__ */ c(Ce, { children: [
262
- /* @__PURE__ */ e(Se, { asChild: !0, children: /* @__PURE__ */ e(
263
- $,
264
- {
265
- variant: "ghost",
266
- size: "icon-md",
267
- className: "h-ds-xs w-ds-xs opacity-0 group-hover:opacity-100 group-focus-within:opacity-100 focus:opacity-100 transition-opacity",
268
- "aria-label": "Column options",
269
- children: /* @__PURE__ */ e(Ke, { className: "h-ico-sm w-ico-sm" })
270
- }
271
- ) }),
272
- /* @__PURE__ */ c(Oe, { align: "end", className: "w-44", children: [
273
- /* @__PURE__ */ c(
274
- q,
275
- {
276
- onClick: () => {
277
- K(t.name), R(!0);
278
- },
279
- children: [
280
- /* @__PURE__ */ e(Ae, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
281
- "Rename"
282
- ]
283
- }
284
- ),
1423
+ title: h.name,
1424
+ children: h.image ? /* @__PURE__ */ e("img", { src: h.image, alt: h.name, className: "h-full w-full object-cover" }) : Pe(h.name)
1425
+ }
1426
+ )
1427
+ ]
1428
+ }
1429
+ );
1430
+ }
1431
+ const Ve = j.forwardRef(
1432
+ function({ task: t }, n) {
1433
+ const {
1434
+ attributes: a,
1435
+ listeners: o,
1436
+ setNodeRef: l,
1437
+ transform: b,
1438
+ transition: w,
1439
+ isDragging: u
1440
+ } = ke({
1441
+ id: t.id,
1442
+ data: {
1443
+ type: "task",
1444
+ task: t
1445
+ }
1446
+ }), d = Re(l, n), x = {
1447
+ transform: Ce.Transform.toString(b),
1448
+ transition: w
1449
+ };
1450
+ return /* @__PURE__ */ e("div", { ref: d, style: x, children: /* @__PURE__ */ e(
1451
+ ze,
1452
+ {
1453
+ task: t,
1454
+ isDragging: u,
1455
+ dragHandleProps: { attributes: a, listeners: o }
1456
+ }
1457
+ ) });
1458
+ }
1459
+ );
1460
+ Ve.displayName = "TaskCardCompact";
1461
+ const Fe = j.forwardRef(function({ task: t }, n) {
1462
+ return /* @__PURE__ */ e("div", { ref: n, children: /* @__PURE__ */ e(ze, { task: t, isDragOverlay: !0 }) });
1463
+ });
1464
+ Fe.displayName = "TaskCardCompactOverlay";
1465
+ const Ue = j.forwardRef(
1466
+ function({ task: t }, n) {
1467
+ return /* @__PURE__ */ e("div", { ref: n, children: /* @__PURE__ */ e(We, { task: t, isDragOverlay: !0 }) });
1468
+ }
1469
+ );
1470
+ Ue.displayName = "TaskCardOverlay";
1471
+ const qt = [
1472
+ { value: "LOW", label: "Low", icon: Se },
1473
+ { value: "MEDIUM", label: "Medium", icon: ge },
1474
+ { value: "HIGH", label: "High", icon: Te },
1475
+ { value: "URGENT", label: "Urgent", icon: le }
1476
+ ];
1477
+ function Xt(s) {
1478
+ const t = /* @__PURE__ */ new Set(), n = [];
1479
+ for (const a of s)
1480
+ for (const o of a.tasks) {
1481
+ o.owner && !t.has(o.owner.id) && (t.add(o.owner.id), n.push(o.owner));
1482
+ for (const l of o.assignees)
1483
+ t.has(l.id) || (t.add(l.id), n.push(l));
1484
+ }
1485
+ return n;
1486
+ }
1487
+ function Jt(s) {
1488
+ const t = /* @__PURE__ */ new Set();
1489
+ for (const n of s)
1490
+ for (const a of n.tasks)
1491
+ for (const o of a.labels) t.add(o);
1492
+ return Array.from(t).sort();
1493
+ }
1494
+ function Ke({ taskId: s, children: t }) {
1495
+ const {
1496
+ rawColumns: n,
1497
+ onQuickPriorityChange: a,
1498
+ onQuickAssign: o,
1499
+ onQuickLabelAdd: l,
1500
+ onQuickDueDateChange: b,
1501
+ onQuickVisibilityChange: w,
1502
+ onQuickDelete: u
1503
+ } = U(), d = Xt(n), x = Jt(n), T = j.useRef(null);
1504
+ return /* @__PURE__ */ r(Tt, { children: [
1505
+ /* @__PURE__ */ e(St, { children: t }),
1506
+ /* @__PURE__ */ r(Rt, { className: "w-52 animate-scale-in", children: [
1507
+ /* @__PURE__ */ r(Z, { children: [
1508
+ /* @__PURE__ */ r(ee, { children: [
1509
+ /* @__PURE__ */ e(le, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
1510
+ "Set Priority"
1511
+ ] }),
1512
+ /* @__PURE__ */ e(te, { className: "w-40", children: qt.map((y) => {
1513
+ const g = y.icon;
1514
+ return /* @__PURE__ */ r(
1515
+ H,
1516
+ {
1517
+ onSelect: () => a(s, y.value),
1518
+ children: [
285
1519
  /* @__PURE__ */ e(
286
- q,
1520
+ g,
287
1521
  {
288
- onClick: () => C == null ? void 0 : C(t.id, !t.isClientVisible),
289
- children: t.isClientVisible ? /* @__PURE__ */ c(X, { children: [
290
- /* @__PURE__ */ e(Te, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
291
- "Hide from client"
292
- ] }) : /* @__PURE__ */ c(X, { children: [
293
- /* @__PURE__ */ e(ee, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
294
- "Show to client"
295
- ] })
1522
+ className: I(
1523
+ "mr-ds-03 h-ico-sm w-ico-sm",
1524
+ ce[y.value]
1525
+ )
296
1526
  }
297
1527
  ),
298
- /* @__PURE__ */ e(Ee, {}),
299
- /* @__PURE__ */ c(
300
- q,
301
- {
302
- className: "text-error focus:text-error",
303
- onClick: () => D == null ? void 0 : D(t.id),
304
- children: [
305
- /* @__PURE__ */ e(ze, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
306
- "Delete column"
307
- ]
308
- }
309
- )
310
- ] })
311
- ] })
312
- ] }),
313
- /* @__PURE__ */ c(
314
- "div",
315
- {
316
- ref: g,
317
- className: j(
318
- "no-scrollbar flex flex-1 flex-col gap-ds-03 overflow-y-auto px-ds-03 pb-ds-03 transition-colors duration-fast-02 ease-productive-standard",
319
- V && "bg-interactive-subtle/50"
320
- ),
321
- children: [
322
- /* @__PURE__ */ e(re, { items: I, strategy: xe, children: t.tasks.map((o) => /* @__PURE__ */ e(ie, { task: o, onClickTask: w }, o.id)) }),
323
- t.tasks.length === 0 && !E && /* @__PURE__ */ e("div", { className: "flex flex-1 items-center justify-center py-ds-07", children: /* @__PURE__ */ e("p", { className: "text-ds-sm text-text-placeholder", children: "No tasks" }) })
1528
+ y.label
324
1529
  ]
325
- }
326
- ),
327
- E ? /* @__PURE__ */ c("div", { className: "border-t border-border-subtle p-ds-03", children: [
1530
+ },
1531
+ y.value
1532
+ );
1533
+ }) })
1534
+ ] }),
1535
+ d.length > 0 && /* @__PURE__ */ r(Z, { children: [
1536
+ /* @__PURE__ */ r(ee, { children: [
1537
+ /* @__PURE__ */ e(q, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
1538
+ "Assign"
1539
+ ] }),
1540
+ /* @__PURE__ */ e(te, { className: "w-44 max-h-48 overflow-y-auto", children: d.map((y) => /* @__PURE__ */ e(
1541
+ H,
1542
+ {
1543
+ onSelect: () => o(s, y.id),
1544
+ children: y.name
1545
+ },
1546
+ y.id
1547
+ )) })
1548
+ ] }),
1549
+ /* @__PURE__ */ r(Z, { children: [
1550
+ /* @__PURE__ */ r(ee, { children: [
1551
+ /* @__PURE__ */ e(kt, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
1552
+ "Add Label"
1553
+ ] }),
1554
+ /* @__PURE__ */ e(te, { className: "w-40 max-h-48 overflow-y-auto", children: x.length > 0 ? x.map((y) => /* @__PURE__ */ e(
1555
+ H,
1556
+ {
1557
+ onSelect: () => l(s, y),
1558
+ children: y
1559
+ },
1560
+ y
1561
+ )) : /* @__PURE__ */ e("div", { className: "px-ds-03 py-ds-02 text-ds-xs text-text-tertiary", children: "No labels found" }) })
1562
+ ] }),
1563
+ /* @__PURE__ */ r(
1564
+ H,
1565
+ {
1566
+ onSelect: (y) => {
1567
+ var g;
1568
+ y.preventDefault(), (g = T.current) == null || g.showPicker();
1569
+ },
1570
+ children: [
1571
+ /* @__PURE__ */ e(xe, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
1572
+ "Set Due Date",
328
1573
  /* @__PURE__ */ e(
329
- H,
1574
+ "input",
330
1575
  {
331
- ref: z,
332
- value: k,
333
- onChange: (o) => S(o.target.value),
334
- onKeyDown: W,
335
- onBlur: () => {
336
- k.trim() || x(!1);
1576
+ ref: T,
1577
+ type: "date",
1578
+ className: "absolute opacity-0 pointer-events-none w-0 h-0",
1579
+ onChange: (y) => {
1580
+ b(s, y.target.value || null);
337
1581
  },
338
- placeholder: "Task title...",
339
- className: "h-ds-sm text-ds-md",
340
- autoFocus: !0
1582
+ tabIndex: -1
341
1583
  }
342
- ),
343
- /* @__PURE__ */ c("div", { className: "mt-ds-02b flex items-center gap-ds-02", children: [
344
- /* @__PURE__ */ e(
345
- $,
346
- {
347
- size: "sm",
348
- className: "h-ds-xs-plus bg-interactive hover:bg-interactive-hover text-text-on-color text-ds-sm",
349
- onClick: M,
350
- disabled: !k.trim(),
351
- children: "Add"
352
- }
353
- ),
354
- /* @__PURE__ */ e(
355
- $,
356
- {
357
- variant: "ghost",
358
- size: "sm",
359
- className: "h-ds-xs-plus text-ds-sm",
360
- onClick: () => {
361
- S(""), x(!1);
362
- },
363
- children: "Cancel"
364
- }
365
- )
366
- ] })
367
- ] }) : /* @__PURE__ */ c(
368
- "button",
1584
+ )
1585
+ ]
1586
+ }
1587
+ ),
1588
+ /* @__PURE__ */ r(Z, { children: [
1589
+ /* @__PURE__ */ r(ee, { children: [
1590
+ /* @__PURE__ */ e(X, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
1591
+ "Visibility"
1592
+ ] }),
1593
+ /* @__PURE__ */ r(te, { className: "w-44", children: [
1594
+ /* @__PURE__ */ r(
1595
+ H,
369
1596
  {
370
- onClick: () => {
371
- x(!0), setTimeout(() => {
372
- var o;
373
- return (o = z.current) == null ? void 0 : o.focus();
374
- }, 50);
375
- },
376
- className: "flex items-center gap-ds-02b border-t border-border-subtle px-ds-04 py-ds-03 text-ds-sm text-text-placeholder transition-colors hover:bg-field hover:text-text-tertiary",
1597
+ onSelect: () => w(s, "INTERNAL"),
1598
+ children: [
1599
+ /* @__PURE__ */ e(De, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
1600
+ "Internal only"
1601
+ ]
1602
+ }
1603
+ ),
1604
+ /* @__PURE__ */ r(
1605
+ H,
1606
+ {
1607
+ onSelect: () => w(s, "EVERYONE"),
1608
+ children: [
1609
+ /* @__PURE__ */ e(X, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
1610
+ "Visible to all"
1611
+ ]
1612
+ }
1613
+ )
1614
+ ] })
1615
+ ] }),
1616
+ /* @__PURE__ */ e(At, {}),
1617
+ /* @__PURE__ */ r(
1618
+ H,
1619
+ {
1620
+ className: "text-error focus:text-error",
1621
+ onSelect: () => u(s),
1622
+ children: [
1623
+ /* @__PURE__ */ e(fe, { className: "mr-ds-03 h-ico-sm w-ico-sm" }),
1624
+ "Delete"
1625
+ ]
1626
+ }
1627
+ )
1628
+ ] })
1629
+ ] });
1630
+ }
1631
+ Ke.displayName = "TaskContextMenu";
1632
+ const Ge = j.forwardRef(
1633
+ function({ column: t, index: n, isOverlay: a }, o) {
1634
+ const { viewMode: l } = U(), { setNodeRef: b, isOver: w } = qe({
1635
+ id: `column-${t.id}`,
1636
+ data: {
1637
+ type: "column",
1638
+ column: t
1639
+ }
1640
+ }), u = t.tasks.map((x) => x.id), d = t.wipLimit != null && t.tasks.length > t.wipLimit;
1641
+ return /* @__PURE__ */ r(
1642
+ "div",
1643
+ {
1644
+ ref: o,
1645
+ className: I(
1646
+ "flex h-full flex-shrink-0 flex-col rounded-ds-xl bg-layer-01/40 backdrop-blur-[2px] border border-border-subtle/20 hover:border-border-subtle/40 transition-colors p-1",
1647
+ a && "shadow-04",
1648
+ d && "bg-error-surface/50"
1649
+ ),
1650
+ style: { width: Mt },
1651
+ children: [
1652
+ /* @__PURE__ */ e(Oe, { column: t, index: n }),
1653
+ /* @__PURE__ */ r(
1654
+ "div",
1655
+ {
1656
+ ref: b,
1657
+ className: I(
1658
+ "no-scrollbar flex flex-1 flex-col gap-ds-02 overflow-y-auto px-ds-03 pt-2.5 pb-ds-03 transition-colors duration-fast-02 ease-productive-standard",
1659
+ w && "bg-interactive-subtle/30"
1660
+ ),
377
1661
  children: [
378
- /* @__PURE__ */ e(Q, { className: "h-3 w-3" }),
379
- "Add task"
1662
+ /* @__PURE__ */ e(Ie, { items: u, strategy: Xe, children: t.tasks.map((x, T) => /* @__PURE__ */ e(
1663
+ "div",
1664
+ {
1665
+ className: "animate-slide-up delay-stagger",
1666
+ style: { "--stagger-index": T },
1667
+ children: /* @__PURE__ */ e(Ke, { taskId: x.id, children: l === "compact" ? /* @__PURE__ */ e(Ve, { task: x }) : /* @__PURE__ */ e(_e, { task: x }) })
1668
+ },
1669
+ x.id
1670
+ )) }),
1671
+ t.tasks.length === 0 && /* @__PURE__ */ e(
1672
+ $e,
1673
+ {
1674
+ index: n,
1675
+ isDropTarget: w
1676
+ }
1677
+ )
380
1678
  ]
381
1679
  }
382
1680
  )
@@ -385,8 +1683,118 @@ const te = [
385
1683
  );
386
1684
  }
387
1685
  );
388
- oe.displayName = "BoardColumn";
389
- function Ge() {
1686
+ Ge.displayName = "BoardColumn";
1687
+ function Zt(s) {
1688
+ const {
1689
+ columns: t,
1690
+ focusedTaskId: n,
1691
+ setFocusedTaskId: a,
1692
+ selectedTaskIds: o,
1693
+ toggleTaskSelection: l,
1694
+ selectRange: b,
1695
+ clearSelection: w,
1696
+ clearFilters: u,
1697
+ hasActiveFilters: d,
1698
+ onClickTask: x
1699
+ } = U(), T = E(
1700
+ (h) => {
1701
+ for (let k = 0; k < t.length; k++)
1702
+ for (let c = 0; c < t[k].tasks.length; c++)
1703
+ if (t[k].tasks[c].id === h)
1704
+ return { columnIndex: k, taskIndex: c, taskId: h };
1705
+ return null;
1706
+ },
1707
+ [t]
1708
+ ), y = E(
1709
+ (h, k) => {
1710
+ const c = t[h];
1711
+ if (!c) return null;
1712
+ const p = c.tasks[k];
1713
+ return (p == null ? void 0 : p.id) ?? null;
1714
+ },
1715
+ [t]
1716
+ ), g = E((h) => {
1717
+ const k = document.querySelector(`[aria-label*="${h}"]`) ?? document.querySelector(`[data-task-id="${h}"]`);
1718
+ k && k.scrollIntoView({ block: "nearest", behavior: "smooth" });
1719
+ }, []), R = E(
1720
+ (h) => {
1721
+ const k = h.target;
1722
+ if (!(k.tagName === "INPUT" || k.tagName === "TEXTAREA" || k.isContentEditable))
1723
+ switch (h.key) {
1724
+ case "ArrowDown":
1725
+ case "ArrowUp": {
1726
+ h.preventDefault();
1727
+ const c = h.key === "ArrowDown" ? 1 : -1;
1728
+ if (!n) {
1729
+ for (const i of t)
1730
+ if (i.tasks.length > 0) {
1731
+ const f = i.tasks[0].id;
1732
+ a(f), g(f);
1733
+ break;
1734
+ }
1735
+ return;
1736
+ }
1737
+ const p = T(n);
1738
+ if (!p) return;
1739
+ const m = p.taskIndex + c, C = y(p.columnIndex, m);
1740
+ C && (a(C), g(C), h.shiftKey && n && b(n, C));
1741
+ return;
1742
+ }
1743
+ case "ArrowLeft":
1744
+ case "ArrowRight": {
1745
+ h.preventDefault();
1746
+ const c = h.key === "ArrowRight" ? 1 : -1;
1747
+ if (!n) return;
1748
+ const p = T(n);
1749
+ if (!p) return;
1750
+ let m = p.columnIndex + c;
1751
+ for (; m >= 0 && m < t.length; ) {
1752
+ if (t[m].tasks.length > 0) {
1753
+ const C = Math.min(p.taskIndex, t[m].tasks.length - 1), i = t[m].tasks[C].id;
1754
+ a(i), g(i);
1755
+ return;
1756
+ }
1757
+ m += c;
1758
+ }
1759
+ return;
1760
+ }
1761
+ case "Enter": {
1762
+ n && (h.preventDefault(), x(n));
1763
+ return;
1764
+ }
1765
+ case " ": {
1766
+ n && (h.preventDefault(), l(n));
1767
+ return;
1768
+ }
1769
+ case "Escape": {
1770
+ h.preventDefault(), o.size > 0 ? w() : d && u();
1771
+ return;
1772
+ }
1773
+ }
1774
+ },
1775
+ [
1776
+ n,
1777
+ t,
1778
+ o,
1779
+ d,
1780
+ T,
1781
+ y,
1782
+ a,
1783
+ g,
1784
+ l,
1785
+ b,
1786
+ w,
1787
+ u,
1788
+ x
1789
+ ]
1790
+ );
1791
+ oe(() => {
1792
+ const h = s.current;
1793
+ if (h)
1794
+ return h.addEventListener("keydown", R), () => h.removeEventListener("keydown", R);
1795
+ }, [s, R]);
1796
+ }
1797
+ function es() {
390
1798
  return {
391
1799
  onDragStart({ active: s }) {
392
1800
  const t = s.data.current;
@@ -394,204 +1802,183 @@ function Ge() {
394
1802
  },
395
1803
  onDragOver({ active: s, over: t }) {
396
1804
  if (!t) return;
397
- const r = s.data.current;
398
- if ((r == null ? void 0 : r.type) === "task")
399
- return `Task ${r.task.title} is over ${t.id}`;
1805
+ const n = s.data.current;
1806
+ if ((n == null ? void 0 : n.type) === "task")
1807
+ return `Task ${n.task.title} is over ${t.id}`;
400
1808
  },
401
1809
  onDragEnd({ active: s, over: t }) {
402
1810
  if (!t) return "Dropped item";
403
- const r = s.data.current;
404
- return (r == null ? void 0 : r.type) === "task" ? `Dropped task: ${r.task.title}` : "Dropped item";
1811
+ const n = s.data.current;
1812
+ return (n == null ? void 0 : n.type) === "task" ? `Dropped task: ${n.task.title}` : "Dropped item";
405
1813
  },
406
1814
  onDragCancel() {
407
1815
  return "Dragging cancelled";
408
1816
  }
409
1817
  };
410
1818
  }
411
- const Pe = F.forwardRef(
412
- function({
413
- initialData: t,
414
- onTaskMove: r,
415
- onTaskAdd: h,
416
- onColumnRename: m,
417
- onColumnDelete: w,
418
- onColumnToggleVisibility: f,
419
- onClickTask: D,
420
- onAddColumn: C
421
- }, T) {
422
- const [E, x] = O(t), [k, S] = O(null), [G, R] = O(!1), B = J(null), K = se(B, T);
423
- Z(() => {
424
- x(t);
425
- }, [t]), Z(() => {
426
- R(!0);
427
- }, []);
428
- const z = be(
429
- U(De, {
430
- activationConstraint: {
431
- distance: 5
432
- }
433
- }),
434
- U(Ie, {
435
- activationConstraint: {
436
- delay: 200,
437
- tolerance: 5
438
- }
439
- }),
440
- U(ke, {
441
- coordinateGetter: we
442
- })
443
- ), P = le(() => Ge(), []), g = E.columns, V = g.map((a) => `column-${a.id}`), I = L(
444
- (a) => {
445
- for (const i of g)
446
- if (i.tasks.some((p) => p.id === a))
447
- return i.id;
448
- return null;
449
- },
450
- [g]
451
- ), A = L(
452
- (a, i, p, u) => {
453
- x((v) => {
454
- const y = v.columns.map((b) => ({
455
- ...b,
456
- tasks: [...b.tasks]
457
- })), d = y.find((b) => b.id === i), N = y.find((b) => b.id === p);
458
- if (!d || !N) return v;
459
- const n = d.tasks.findIndex((b) => b.id === a);
460
- if (n === -1) return v;
461
- const [l] = d.tasks.splice(n, 1);
462
- return N.tasks.splice(u, 0, l), { columns: y };
463
- });
464
- },
465
- []
466
- ), M = L((a) => {
467
- const i = a.active.data.current;
468
- (i == null ? void 0 : i.type) === "task" && S(i.task);
469
- }, []), W = L(
470
- (a) => {
471
- const { active: i, over: p } = a;
472
- if (!p) return;
473
- const u = i.id, v = p.id, y = I(u);
474
- if (!y) return;
475
- let d = null, N = 0;
476
- if (v.startsWith("column-")) {
477
- d = v.replace("column-", "");
478
- const n = g.find((l) => l.id === d);
479
- N = (n == null ? void 0 : n.tasks.length) ?? 0;
480
- } else if (d = I(v), d) {
481
- const n = g.find((l) => l.id === d);
482
- N = (n == null ? void 0 : n.tasks.findIndex((l) => l.id === v)) ?? 0;
1819
+ function ts({ className: s }) {
1820
+ const {
1821
+ columns: t,
1822
+ viewMode: n,
1823
+ activeTask: a,
1824
+ setActiveTask: o,
1825
+ onTaskMove: l,
1826
+ onAddColumn: b
1827
+ } = U(), [w, u] = A(!1);
1828
+ ae(null);
1829
+ const d = ae(null);
1830
+ Zt(d), oe(() => {
1831
+ u(!0);
1832
+ }, []);
1833
+ const x = Je(
1834
+ me(it, {
1835
+ activationConstraint: { distance: 5 }
1836
+ }),
1837
+ me(rt, {
1838
+ activationConstraint: { delay: 200, tolerance: 5 }
1839
+ }),
1840
+ me(at, {
1841
+ coordinateGetter: nt
1842
+ })
1843
+ ), T = ne(() => es(), []), y = t.map((c) => `column-${c.id}`), g = E(
1844
+ (c) => {
1845
+ for (const p of t)
1846
+ if (p.tasks.some((m) => m.id === c))
1847
+ return p.id;
1848
+ return null;
1849
+ },
1850
+ [t]
1851
+ ), R = E(
1852
+ (c) => {
1853
+ const p = c.active.data.current;
1854
+ (p == null ? void 0 : p.type) === "task" && o(p.task);
1855
+ },
1856
+ [o]
1857
+ ), h = E(
1858
+ (c) => {
1859
+ const { active: p, over: m } = c;
1860
+ if (!m) return;
1861
+ const C = p.id, i = m.id, f = g(C);
1862
+ if (!f) return;
1863
+ let D = null, M = 0;
1864
+ if (i.startsWith("column-")) {
1865
+ D = i.replace("column-", "");
1866
+ const N = t.find((S) => S.id === D);
1867
+ M = (N == null ? void 0 : N.tasks.length) ?? 0;
1868
+ } else if (D = g(i), D) {
1869
+ const N = t.find((S) => S.id === D);
1870
+ M = (N == null ? void 0 : N.tasks.findIndex((S) => S.id === i)) ?? 0;
1871
+ }
1872
+ !D || f === D || l(C, D, M);
1873
+ },
1874
+ [t, g, l]
1875
+ ), k = E(
1876
+ (c) => {
1877
+ const { active: p, over: m } = c;
1878
+ if (o(null), !m) return;
1879
+ const C = p.id, i = m.id, f = g(C);
1880
+ if (!f) return;
1881
+ let D, M;
1882
+ if (i.startsWith("column-")) {
1883
+ D = i.replace("column-", "");
1884
+ const N = t.find((S) => S.id === D);
1885
+ if (M = (N == null ? void 0 : N.tasks.length) ?? 0, f === D) {
1886
+ const S = N == null ? void 0 : N.tasks.findIndex(($) => $.id === C);
1887
+ S !== void 0 && S >= 0 && (M = S);
483
1888
  }
484
- !d || y === d || A(u, y, d, N);
485
- },
486
- [g, I, A]
487
- ), _ = L(
488
- (a) => {
489
- const { active: i, over: p } = a;
490
- if (S(null), !p) return;
491
- const u = i.id, v = p.id, y = I(u);
492
- if (!y) return;
493
- let d, N;
494
- if (v.startsWith("column-")) {
495
- d = v.replace("column-", "");
496
- const n = g.find((l) => l.id === d);
497
- if (N = (n == null ? void 0 : n.tasks.length) ?? 0, y === d) {
498
- const l = n == null ? void 0 : n.tasks.findIndex((b) => b.id === u);
499
- l !== void 0 && l >= 0 && (N = l);
1889
+ } else {
1890
+ D = g(i) ?? f;
1891
+ const N = t.find((S) => S.id === D);
1892
+ M = (N == null ? void 0 : N.tasks.findIndex((S) => S.id === i)) ?? 0;
1893
+ }
1894
+ l(C, D, M);
1895
+ },
1896
+ [t, g, o, l]
1897
+ );
1898
+ return /* @__PURE__ */ r(
1899
+ Ze,
1900
+ {
1901
+ sensors: x,
1902
+ collisionDetection: et,
1903
+ onDragStart: R,
1904
+ onDragOver: h,
1905
+ onDragEnd: k,
1906
+ accessibility: { announcements: T },
1907
+ children: [
1908
+ /* @__PURE__ */ r(
1909
+ "div",
1910
+ {
1911
+ ref: d,
1912
+ tabIndex: 0,
1913
+ className: "no-scrollbar flex h-full gap-ds-05 overflow-x-auto pb-ds-05 outline-none",
1914
+ children: [
1915
+ /* @__PURE__ */ e(
1916
+ Ie,
1917
+ {
1918
+ items: y,
1919
+ strategy: tt,
1920
+ children: t.map((c, p) => /* @__PURE__ */ e(
1921
+ "div",
1922
+ {
1923
+ className: "flex-shrink-0 animate-slide-right delay-stagger-50",
1924
+ style: { "--stagger-index": p },
1925
+ children: /* @__PURE__ */ e(Ge, { column: c, index: p })
1926
+ },
1927
+ c.id
1928
+ ))
1929
+ }
1930
+ ),
1931
+ /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ r(
1932
+ O,
1933
+ {
1934
+ variant: "ghost",
1935
+ onClick: b,
1936
+ className: "h-ds-md w-[320px] justify-start gap-ds-03 rounded-ds-xl border border-dashed border-border/60 bg-layer-02 text-text-tertiary hover:border-border-interactive hover:bg-interactive-subtle/50 hover:text-interactive",
1937
+ children: [
1938
+ /* @__PURE__ */ e(pe, { className: "h-ico-sm w-ico-sm" }),
1939
+ "Add column"
1940
+ ]
1941
+ }
1942
+ ) })
1943
+ ]
500
1944
  }
501
- } else {
502
- d = I(v) ?? y;
503
- const n = g.find((l) => l.id === d);
504
- N = (n == null ? void 0 : n.tasks.findIndex((l) => l.id === v)) ?? 0;
505
- }
506
- if (y === d) {
507
- const n = g.find((b) => b.id === d), l = n == null ? void 0 : n.tasks.findIndex((b) => b.id === u);
508
- l !== void 0 && l !== N && A(u, y, d, N);
509
- }
510
- r == null || r(u, d, N);
511
- },
512
- [g, I, A, r]
513
- ), Y = (a, i) => {
514
- h == null || h(a, i);
515
- }, o = (a, i) => {
516
- x((p) => ({
517
- columns: p.columns.map(
518
- (u) => u.id === a ? { ...u, name: i } : u
519
- )
520
- })), m == null || m(a, i);
521
- }, de = (a) => {
522
- x((i) => ({
523
- columns: i.columns.filter((p) => p.id !== a)
524
- })), w == null || w(a);
525
- }, ce = (a, i) => {
526
- x((p) => ({
527
- columns: p.columns.map(
528
- (u) => u.id === a ? { ...u, isClientVisible: i } : u
1945
+ ),
1946
+ w && Ye(
1947
+ /* @__PURE__ */ e(st, { dropAnimation: { duration: 240, easing: "cubic-bezier(0.34, 1.56, 0.64, 1)" }, children: a ? n === "compact" ? /* @__PURE__ */ e(Fe, { task: a }) : /* @__PURE__ */ e(Ue, { task: a }) : null }),
1948
+ document.body
529
1949
  )
530
- })), f == null || f(a, i);
531
- };
532
- return /* @__PURE__ */ c(
533
- ge,
534
- {
535
- sensors: z,
536
- collisionDetection: ve,
537
- onDragStart: M,
538
- onDragOver: W,
539
- onDragEnd: _,
540
- accessibility: { announcements: P },
541
- children: [
542
- /* @__PURE__ */ c(
543
- "div",
544
- {
545
- ref: K,
546
- className: "no-scrollbar flex h-full gap-ds-05 overflow-x-auto pb-ds-05",
547
- children: [
548
- /* @__PURE__ */ e(
549
- re,
550
- {
551
- items: V,
552
- strategy: ye,
553
- children: g.map((a, i) => /* @__PURE__ */ e("div", { className: "group flex-shrink-0", children: /* @__PURE__ */ e(
554
- oe,
555
- {
556
- column: a,
557
- index: i,
558
- onAddTask: Y,
559
- onClickTask: D,
560
- onRenameColumn: o,
561
- onDeleteColumn: de,
562
- onToggleVisibility: ce
563
- }
564
- ) }, a.id))
565
- }
566
- ),
567
- /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ c(
568
- $,
569
- {
570
- variant: "ghost",
571
- onClick: C,
572
- className: "h-ds-md w-[300px] justify-start gap-ds-03 rounded-ds-xl border border-dashed border-border/60 bg-layer-02 text-text-tertiary hover:border-border-interactive hover:bg-interactive-subtle/50 hover:text-interactive",
573
- children: [
574
- /* @__PURE__ */ e(Q, { className: "h-ico-sm w-ico-sm" }),
575
- "Add column"
576
- ]
577
- }
578
- ) })
579
- ]
580
- }
581
- ),
582
- G && me(
583
- /* @__PURE__ */ e(Ne, { dropAnimation: null, children: k ? /* @__PURE__ */ e(ne, { task: k }) : null }),
584
- document.body
585
- )
586
- ]
587
- }
588
- );
1950
+ ]
1951
+ }
1952
+ );
1953
+ }
1954
+ const ss = j.forwardRef(
1955
+ function({ className: t, ...n }, a) {
1956
+ return /* @__PURE__ */ e("div", { ref: a, className: t, children: /* @__PURE__ */ e(Ot, { ...n, children: /* @__PURE__ */ r("div", { className: "flex flex-col gap-ds-03", children: [
1957
+ /* @__PURE__ */ e(Le, {}),
1958
+ /* @__PURE__ */ e(Ee, {}),
1959
+ /* @__PURE__ */ e(ts, {})
1960
+ ] }) }) });
589
1961
  }
590
1962
  );
591
- Pe.displayName = "KanbanBoard";
1963
+ ss.displayName = "KanbanBoard";
592
1964
  export {
593
- oe as B,
594
- Pe as K,
595
- ie as T,
596
- ne as a
1965
+ Ge as B,
1966
+ ye as C,
1967
+ we as D,
1968
+ ss as K,
1969
+ ce as P,
1970
+ _e as T,
1971
+ Ot as a,
1972
+ Le as b,
1973
+ Ee as c,
1974
+ Mt as d,
1975
+ $e as e,
1976
+ Oe as f,
1977
+ ws as g,
1978
+ Ve as h,
1979
+ Fe as i,
1980
+ Ue as j,
1981
+ Ke as k,
1982
+ Zt as l,
1983
+ U as u
597
1984
  };